:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v43-page { max-width: 1560px; }
.v43-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v43-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v43-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v43-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v43-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v43-filters { margin:16px 0; }
.v43-filters button { display:none; }
.v43-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v43-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v43-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v43-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v43-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v43-kpi small { color:var(--ns-muted); font-weight:750; }
.v43-kpi.month { border-top-color:var(--ns-orange); } .v43-kpi.year { border-top-color:var(--ns-blue); }
.v43-kpi.current { border-top-color:var(--ok); } .v43-kpi.pending { border-top-color:#ff8300; }
.v43-kpi.total { border-top-color:var(--ns-blue-2); } .v43-kpi.risk { border-top-color:var(--critico); }
.v43-projection,.v43-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v43-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v43-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v43-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v43-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v43-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v43-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v43-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v43-board-table th:last-child { border-radius:0 16px 16px 0; }
.v43-board-table th b,.v43-board-table th span { display:block; }
.v43-board-table th span { color:#dbefff; font-size:11px; }
.v43-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v43-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v43-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v43-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v43-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v43-board-table .num { text-align:center; white-space:nowrap; }
.v43-board-table .total-col { background:#d7ebff!important; }
.v43-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v43-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v43-hero,.v43-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v43-section-head{display:grid;} .v43-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v43-board-table th:first-child,.v43-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v44-page { max-width: 1560px; }
.v44-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v44-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v44-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v44-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v44-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v44-filters { margin:16px 0; }
.v44-filters button { display:none; }
.v44-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v44-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v44-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v44-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v44-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v44-kpi small { color:var(--ns-muted); font-weight:750; }
.v44-kpi.month { border-top-color:var(--ns-orange); } .v44-kpi.year { border-top-color:var(--ns-blue); }
.v44-kpi.current { border-top-color:var(--ok); } .v44-kpi.pending { border-top-color:#ff8300; }
.v44-kpi.total { border-top-color:var(--ns-blue-2); } .v44-kpi.risk { border-top-color:var(--critico); }
.v44-projection,.v44-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v44-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v44-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v44-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v44-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v44-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v44-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v44-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v44-board-table th:last-child { border-radius:0 16px 16px 0; }
.v44-board-table th b,.v44-board-table th span { display:block; }
.v44-board-table th span { color:#dbefff; font-size:11px; }
.v44-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v44-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v44-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v44-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v44-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v44-board-table .num { text-align:center; white-space:nowrap; }
.v44-board-table .total-col { background:#d7ebff!important; }
.v44-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v44-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v44-hero,.v44-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v44-section-head{display:grid;} .v44-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v44-board-table th:first-child,.v44-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v44-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v44-board-table th:first-child,
.v44-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v44-board-table th:not(:first-child),
.v44-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}

/* V45 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v43-page { max-width: 1560px; }
.v43-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v43-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v43-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v43-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v43-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v43-filters { margin:16px 0; }
.v43-filters button { display:none; }
.v43-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v43-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v43-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v43-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v43-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v43-kpi small { color:var(--ns-muted); font-weight:750; }
.v43-kpi.month { border-top-color:var(--ns-orange); } .v43-kpi.year { border-top-color:var(--ns-blue); }
.v43-kpi.current { border-top-color:var(--ok); } .v43-kpi.pending { border-top-color:#ff8300; }
.v43-kpi.total { border-top-color:var(--ns-blue-2); } .v43-kpi.risk { border-top-color:var(--critico); }
.v43-projection,.v43-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v43-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v43-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v43-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v43-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v43-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v43-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v43-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v43-board-table th:last-child { border-radius:0 16px 16px 0; }
.v43-board-table th b,.v43-board-table th span { display:block; }
.v43-board-table th span { color:#dbefff; font-size:11px; }
.v43-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v43-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v43-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v43-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v43-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v43-board-table .num { text-align:center; white-space:nowrap; }
.v43-board-table .total-col { background:#d7ebff!important; }
.v43-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v43-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v43-hero,.v43-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v43-section-head{display:grid;} .v43-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v43-board-table th:first-child,.v43-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v45-page { max-width: 1560px; }
.v45-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v45-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v45-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v45-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v45-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v45-filters { margin:16px 0; }
.v45-filters button { display:none; }
.v45-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v45-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v45-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v45-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v45-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v45-kpi small { color:var(--ns-muted); font-weight:750; }
.v45-kpi.month { border-top-color:var(--ns-orange); } .v45-kpi.year { border-top-color:var(--ns-blue); }
.v45-kpi.current { border-top-color:var(--ok); } .v45-kpi.pending { border-top-color:#ff8300; }
.v45-kpi.total { border-top-color:var(--ns-blue-2); } .v45-kpi.risk { border-top-color:var(--critico); }
.v45-projection,.v45-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v45-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v45-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v45-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v45-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v45-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v45-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v45-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v45-board-table th:last-child { border-radius:0 16px 16px 0; }
.v45-board-table th b,.v45-board-table th span { display:block; }
.v45-board-table th span { color:#dbefff; font-size:11px; }
.v45-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v45-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v45-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v45-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v45-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v45-board-table .num { text-align:center; white-space:nowrap; }
.v45-board-table .total-col { background:#d7ebff!important; }
.v45-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v45-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v45-hero,.v45-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v45-section-head{display:grid;} .v45-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v45-board-table th:first-child,.v45-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v45-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v45-board-table th:first-child,
.v45-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v45-board-table th:not(:first-child),
.v45-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}


/* ===== V45: chart only in modal, weekly accumulated bars ===== */
.v45-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v45-board-table th:first-child,
.v45-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v45-board-table th:not(:first-child),
.v45-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}
.modal-chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.modal-chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}

/* V46 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v46-page { max-width: 1560px; }
.v46-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v46-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v46-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v46-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v46-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v46-filters { margin:16px 0; }
.v46-filters button { display:none; }
.v46-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v46-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v46-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v46-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v46-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v46-kpi small { color:var(--ns-muted); font-weight:750; }
.v46-kpi.month { border-top-color:var(--ns-orange); } .v46-kpi.year { border-top-color:var(--ns-blue); }
.v46-kpi.current { border-top-color:var(--ok); } .v46-kpi.pending { border-top-color:#ff8300; }
.v46-kpi.total { border-top-color:var(--ns-blue-2); } .v46-kpi.risk { border-top-color:var(--critico); }
.v46-projection,.v46-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v46-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v46-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v46-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v46-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v46-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v46-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v46-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v46-board-table th:last-child { border-radius:0 16px 16px 0; }
.v46-board-table th b,.v46-board-table th span { display:block; }
.v46-board-table th span { color:#dbefff; font-size:11px; }
.v46-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v46-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v46-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v46-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v46-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v46-board-table .num { text-align:center; white-space:nowrap; }
.v46-board-table .total-col { background:#d7ebff!important; }
.v46-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v46-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v46-hero,.v46-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v46-section-head{display:grid;} .v46-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v46-page { max-width: 1560px; }
.v46-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v46-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v46-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v46-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v46-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v46-filters { margin:16px 0; }
.v46-filters button { display:none; }
.v46-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v46-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v46-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v46-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v46-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v46-kpi small { color:var(--ns-muted); font-weight:750; }
.v46-kpi.month { border-top-color:var(--ns-orange); } .v46-kpi.year { border-top-color:var(--ns-blue); }
.v46-kpi.current { border-top-color:var(--ok); } .v46-kpi.pending { border-top-color:#ff8300; }
.v46-kpi.total { border-top-color:var(--ns-blue-2); } .v46-kpi.risk { border-top-color:var(--critico); }
.v46-projection,.v46-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v46-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v46-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v46-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v46-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v46-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v46-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v46-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v46-board-table th:last-child { border-radius:0 16px 16px 0; }
.v46-board-table th b,.v46-board-table th span { display:block; }
.v46-board-table th span { color:#dbefff; font-size:11px; }
.v46-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v46-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v46-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v46-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v46-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v46-board-table .num { text-align:center; white-space:nowrap; }
.v46-board-table .total-col { background:#d7ebff!important; }
.v46-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v46-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v46-hero,.v46-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v46-section-head{display:grid;} .v46-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v46-board-table th:first-child,.v46-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v46-page { max-width: 1560px; }
.v46-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v46-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v46-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v46-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v46-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v46-filters { margin:16px 0; }
.v46-filters button { display:none; }
.v46-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v46-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v46-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v46-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v46-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v46-kpi small { color:var(--ns-muted); font-weight:750; }
.v46-kpi.month { border-top-color:var(--ns-orange); } .v46-kpi.year { border-top-color:var(--ns-blue); }
.v46-kpi.current { border-top-color:var(--ok); } .v46-kpi.pending { border-top-color:#ff8300; }
.v46-kpi.total { border-top-color:var(--ns-blue-2); } .v46-kpi.risk { border-top-color:var(--critico); }
.v46-projection,.v46-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v46-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v46-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v46-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v46-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v46-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v46-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v46-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v46-board-table th:last-child { border-radius:0 16px 16px 0; }
.v46-board-table th b,.v46-board-table th span { display:block; }
.v46-board-table th span { color:#dbefff; font-size:11px; }
.v46-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v46-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v46-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v46-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v46-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v46-board-table .num { text-align:center; white-space:nowrap; }
.v46-board-table .total-col { background:#d7ebff!important; }
.v46-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v46-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v46-hero,.v46-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v46-section-head{display:grid;} .v46-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v46-page { max-width: 1560px; }
.v46-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v46-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v46-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v46-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v46-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v46-filters { margin:16px 0; }
.v46-filters button { display:none; }
.v46-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v46-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v46-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v46-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v46-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v46-kpi small { color:var(--ns-muted); font-weight:750; }
.v46-kpi.month { border-top-color:var(--ns-orange); } .v46-kpi.year { border-top-color:var(--ns-blue); }
.v46-kpi.current { border-top-color:var(--ok); } .v46-kpi.pending { border-top-color:#ff8300; }
.v46-kpi.total { border-top-color:var(--ns-blue-2); } .v46-kpi.risk { border-top-color:var(--critico); }
.v46-projection,.v46-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v46-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v46-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v46-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v46-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v46-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v46-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v46-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v46-board-table th:last-child { border-radius:0 16px 16px 0; }
.v46-board-table th b,.v46-board-table th span { display:block; }
.v46-board-table th span { color:#dbefff; font-size:11px; }
.v46-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v46-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v46-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v46-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v46-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v46-board-table .num { text-align:center; white-space:nowrap; }
.v46-board-table .total-col { background:#d7ebff!important; }
.v46-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v46-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v46-hero,.v46-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v46-section-head{display:grid;} .v46-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v46-board-table th:first-child,.v46-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v46-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v46-board-table th:first-child,
.v46-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v46-board-table th:not(:first-child),
.v46-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}

/* V45 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v46-page { max-width: 1560px; }
.v46-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v46-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v46-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v46-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v46-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v46-filters { margin:16px 0; }
.v46-filters button { display:none; }
.v46-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v46-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v46-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v46-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v46-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v46-kpi small { color:var(--ns-muted); font-weight:750; }
.v46-kpi.month { border-top-color:var(--ns-orange); } .v46-kpi.year { border-top-color:var(--ns-blue); }
.v46-kpi.current { border-top-color:var(--ok); } .v46-kpi.pending { border-top-color:#ff8300; }
.v46-kpi.total { border-top-color:var(--ns-blue-2); } .v46-kpi.risk { border-top-color:var(--critico); }
.v46-projection,.v46-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v46-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v46-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v46-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v46-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v46-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v46-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v46-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v46-board-table th:last-child { border-radius:0 16px 16px 0; }
.v46-board-table th b,.v46-board-table th span { display:block; }
.v46-board-table th span { color:#dbefff; font-size:11px; }
.v46-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v46-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v46-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v46-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v46-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v46-board-table .num { text-align:center; white-space:nowrap; }
.v46-board-table .total-col { background:#d7ebff!important; }
.v46-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v46-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v46-hero,.v46-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v46-section-head{display:grid;} .v46-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v46-page { max-width: 1560px; }
.v46-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v46-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v46-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v46-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v46-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v46-filters { margin:16px 0; }
.v46-filters button { display:none; }
.v46-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v46-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v46-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v46-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v46-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v46-kpi small { color:var(--ns-muted); font-weight:750; }
.v46-kpi.month { border-top-color:var(--ns-orange); } .v46-kpi.year { border-top-color:var(--ns-blue); }
.v46-kpi.current { border-top-color:var(--ok); } .v46-kpi.pending { border-top-color:#ff8300; }
.v46-kpi.total { border-top-color:var(--ns-blue-2); } .v46-kpi.risk { border-top-color:var(--critico); }
.v46-projection,.v46-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v46-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v46-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v46-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v46-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v46-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v46-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v46-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v46-board-table th:last-child { border-radius:0 16px 16px 0; }
.v46-board-table th b,.v46-board-table th span { display:block; }
.v46-board-table th span { color:#dbefff; font-size:11px; }
.v46-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v46-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v46-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v46-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v46-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v46-board-table .num { text-align:center; white-space:nowrap; }
.v46-board-table .total-col { background:#d7ebff!important; }
.v46-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v46-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v46-hero,.v46-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v46-section-head{display:grid;} .v46-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v46-board-table th:first-child,.v46-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v46-page { max-width: 1560px; }
.v46-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v46-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v46-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v46-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v46-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v46-filters { margin:16px 0; }
.v46-filters button { display:none; }
.v46-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v46-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v46-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v46-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v46-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v46-kpi small { color:var(--ns-muted); font-weight:750; }
.v46-kpi.month { border-top-color:var(--ns-orange); } .v46-kpi.year { border-top-color:var(--ns-blue); }
.v46-kpi.current { border-top-color:var(--ok); } .v46-kpi.pending { border-top-color:#ff8300; }
.v46-kpi.total { border-top-color:var(--ns-blue-2); } .v46-kpi.risk { border-top-color:var(--critico); }
.v46-projection,.v46-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v46-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v46-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v46-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v46-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v46-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v46-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v46-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v46-board-table th:last-child { border-radius:0 16px 16px 0; }
.v46-board-table th b,.v46-board-table th span { display:block; }
.v46-board-table th span { color:#dbefff; font-size:11px; }
.v46-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v46-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v46-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v46-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v46-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v46-board-table .num { text-align:center; white-space:nowrap; }
.v46-board-table .total-col { background:#d7ebff!important; }
.v46-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v46-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v46-hero,.v46-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v46-section-head{display:grid;} .v46-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v46-page { max-width: 1560px; }
.v46-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v46-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v46-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v46-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v46-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v46-filters { margin:16px 0; }
.v46-filters button { display:none; }
.v46-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v46-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v46-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v46-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v46-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v46-kpi small { color:var(--ns-muted); font-weight:750; }
.v46-kpi.month { border-top-color:var(--ns-orange); } .v46-kpi.year { border-top-color:var(--ns-blue); }
.v46-kpi.current { border-top-color:var(--ok); } .v46-kpi.pending { border-top-color:#ff8300; }
.v46-kpi.total { border-top-color:var(--ns-blue-2); } .v46-kpi.risk { border-top-color:var(--critico); }
.v46-projection,.v46-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v46-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v46-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v46-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v46-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v46-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v46-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v46-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v46-board-table th:last-child { border-radius:0 16px 16px 0; }
.v46-board-table th b,.v46-board-table th span { display:block; }
.v46-board-table th span { color:#dbefff; font-size:11px; }
.v46-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v46-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v46-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v46-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v46-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v46-board-table .num { text-align:center; white-space:nowrap; }
.v46-board-table .total-col { background:#d7ebff!important; }
.v46-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v46-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v46-hero,.v46-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v46-section-head{display:grid;} .v46-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v46-board-table th:first-child,.v46-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v46-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v46-board-table th:first-child,
.v46-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v46-board-table th:not(:first-child),
.v46-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}


/* ===== V45: chart only in modal, weekly accumulated bars ===== */
.v46-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v46-board-table th:first-child,
.v46-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v46-board-table th:not(:first-child),
.v46-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}
.modal-chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.modal-chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}


/* ===== V46: single script, modals only for card charts ===== */
.v46-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v46-board-table th:first-child,
.v46-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v46-board-table th:not(:first-child),
.v46-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}

/* V47 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v43-page { max-width: 1560px; }
.v43-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v43-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v43-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v43-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v43-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v43-filters { margin:16px 0; }
.v43-filters button { display:none; }
.v43-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v43-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v43-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v43-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v43-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v43-kpi small { color:var(--ns-muted); font-weight:750; }
.v43-kpi.month { border-top-color:var(--ns-orange); } .v43-kpi.year { border-top-color:var(--ns-blue); }
.v43-kpi.current { border-top-color:var(--ok); } .v43-kpi.pending { border-top-color:#ff8300; }
.v43-kpi.total { border-top-color:var(--ns-blue-2); } .v43-kpi.risk { border-top-color:var(--critico); }
.v43-projection,.v43-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v43-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v43-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v43-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v43-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v43-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v43-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v43-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v43-board-table th:last-child { border-radius:0 16px 16px 0; }
.v43-board-table th b,.v43-board-table th span { display:block; }
.v43-board-table th span { color:#dbefff; font-size:11px; }
.v43-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v43-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v43-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v43-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v43-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v43-board-table .num { text-align:center; white-space:nowrap; }
.v43-board-table .total-col { background:#d7ebff!important; }
.v43-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v43-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v43-hero,.v43-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v43-section-head{display:grid;} .v43-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v43-board-table th:first-child,.v43-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v47-page { max-width: 1560px; }
.v47-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v47-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v47-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v47-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v47-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v47-filters { margin:16px 0; }
.v47-filters button { display:none; }
.v47-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v47-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v47-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v47-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v47-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v47-kpi small { color:var(--ns-muted); font-weight:750; }
.v47-kpi.month { border-top-color:var(--ns-orange); } .v47-kpi.year { border-top-color:var(--ns-blue); }
.v47-kpi.current { border-top-color:var(--ok); } .v47-kpi.pending { border-top-color:#ff8300; }
.v47-kpi.total { border-top-color:var(--ns-blue-2); } .v47-kpi.risk { border-top-color:var(--critico); }
.v47-projection,.v47-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v47-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v47-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v47-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v47-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v47-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v47-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v47-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v47-board-table th:last-child { border-radius:0 16px 16px 0; }
.v47-board-table th b,.v47-board-table th span { display:block; }
.v47-board-table th span { color:#dbefff; font-size:11px; }
.v47-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v47-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v47-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v47-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v47-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v47-board-table .num { text-align:center; white-space:nowrap; }
.v47-board-table .total-col { background:#d7ebff!important; }
.v47-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v47-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v47-hero,.v47-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v47-section-head{display:grid;} .v47-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v47-board-table th:first-child,.v47-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v47-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v47-board-table th:first-child,
.v47-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v47-board-table th:not(:first-child),
.v47-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}

/* V45 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v43-page { max-width: 1560px; }
.v43-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v43-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v43-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v43-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v43-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v43-filters { margin:16px 0; }
.v43-filters button { display:none; }
.v43-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v43-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v43-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v43-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v43-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v43-kpi small { color:var(--ns-muted); font-weight:750; }
.v43-kpi.month { border-top-color:var(--ns-orange); } .v43-kpi.year { border-top-color:var(--ns-blue); }
.v43-kpi.current { border-top-color:var(--ok); } .v43-kpi.pending { border-top-color:#ff8300; }
.v43-kpi.total { border-top-color:var(--ns-blue-2); } .v43-kpi.risk { border-top-color:var(--critico); }
.v43-projection,.v43-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v43-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v43-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v43-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v43-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v43-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v43-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v43-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v43-board-table th:last-child { border-radius:0 16px 16px 0; }
.v43-board-table th b,.v43-board-table th span { display:block; }
.v43-board-table th span { color:#dbefff; font-size:11px; }
.v43-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v43-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v43-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v43-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v43-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v43-board-table .num { text-align:center; white-space:nowrap; }
.v43-board-table .total-col { background:#d7ebff!important; }
.v43-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v43-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v43-hero,.v43-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v43-section-head{display:grid;} .v43-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v43-board-table th:first-child,.v43-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v47-page { max-width: 1560px; }
.v47-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v47-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v47-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v47-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v47-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v47-filters { margin:16px 0; }
.v47-filters button { display:none; }
.v47-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v47-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v47-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v47-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v47-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v47-kpi small { color:var(--ns-muted); font-weight:750; }
.v47-kpi.month { border-top-color:var(--ns-orange); } .v47-kpi.year { border-top-color:var(--ns-blue); }
.v47-kpi.current { border-top-color:var(--ok); } .v47-kpi.pending { border-top-color:#ff8300; }
.v47-kpi.total { border-top-color:var(--ns-blue-2); } .v47-kpi.risk { border-top-color:var(--critico); }
.v47-projection,.v47-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v47-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v47-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v47-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v47-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v47-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v47-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v47-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v47-board-table th:last-child { border-radius:0 16px 16px 0; }
.v47-board-table th b,.v47-board-table th span { display:block; }
.v47-board-table th span { color:#dbefff; font-size:11px; }
.v47-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v47-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v47-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v47-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v47-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v47-board-table .num { text-align:center; white-space:nowrap; }
.v47-board-table .total-col { background:#d7ebff!important; }
.v47-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v47-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v47-hero,.v47-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v47-section-head{display:grid;} .v47-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v47-board-table th:first-child,.v47-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v47-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v47-board-table th:first-child,
.v47-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v47-board-table th:not(:first-child),
.v47-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}


/* ===== V45: chart only in modal, weekly accumulated bars ===== */
.v47-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v47-board-table th:first-child,
.v47-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v47-board-table th:not(:first-child),
.v47-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}
.modal-chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.modal-chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}

/* V46 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v47-page { max-width: 1560px; }
.v47-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v47-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v47-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v47-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v47-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v47-filters { margin:16px 0; }
.v47-filters button { display:none; }
.v47-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v47-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v47-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v47-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v47-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v47-kpi small { color:var(--ns-muted); font-weight:750; }
.v47-kpi.month { border-top-color:var(--ns-orange); } .v47-kpi.year { border-top-color:var(--ns-blue); }
.v47-kpi.current { border-top-color:var(--ok); } .v47-kpi.pending { border-top-color:#ff8300; }
.v47-kpi.total { border-top-color:var(--ns-blue-2); } .v47-kpi.risk { border-top-color:var(--critico); }
.v47-projection,.v47-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v47-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v47-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v47-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v47-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v47-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v47-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v47-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v47-board-table th:last-child { border-radius:0 16px 16px 0; }
.v47-board-table th b,.v47-board-table th span { display:block; }
.v47-board-table th span { color:#dbefff; font-size:11px; }
.v47-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v47-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v47-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v47-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v47-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v47-board-table .num { text-align:center; white-space:nowrap; }
.v47-board-table .total-col { background:#d7ebff!important; }
.v47-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v47-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v47-hero,.v47-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v47-section-head{display:grid;} .v47-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v47-page { max-width: 1560px; }
.v47-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v47-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v47-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v47-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v47-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v47-filters { margin:16px 0; }
.v47-filters button { display:none; }
.v47-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v47-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v47-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v47-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v47-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v47-kpi small { color:var(--ns-muted); font-weight:750; }
.v47-kpi.month { border-top-color:var(--ns-orange); } .v47-kpi.year { border-top-color:var(--ns-blue); }
.v47-kpi.current { border-top-color:var(--ok); } .v47-kpi.pending { border-top-color:#ff8300; }
.v47-kpi.total { border-top-color:var(--ns-blue-2); } .v47-kpi.risk { border-top-color:var(--critico); }
.v47-projection,.v47-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v47-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v47-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v47-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v47-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v47-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v47-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v47-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v47-board-table th:last-child { border-radius:0 16px 16px 0; }
.v47-board-table th b,.v47-board-table th span { display:block; }
.v47-board-table th span { color:#dbefff; font-size:11px; }
.v47-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v47-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v47-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v47-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v47-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v47-board-table .num { text-align:center; white-space:nowrap; }
.v47-board-table .total-col { background:#d7ebff!important; }
.v47-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v47-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v47-hero,.v47-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v47-section-head{display:grid;} .v47-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v47-board-table th:first-child,.v47-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v47-page { max-width: 1560px; }
.v47-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v47-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v47-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v47-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v47-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v47-filters { margin:16px 0; }
.v47-filters button { display:none; }
.v47-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v47-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v47-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v47-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v47-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v47-kpi small { color:var(--ns-muted); font-weight:750; }
.v47-kpi.month { border-top-color:var(--ns-orange); } .v47-kpi.year { border-top-color:var(--ns-blue); }
.v47-kpi.current { border-top-color:var(--ok); } .v47-kpi.pending { border-top-color:#ff8300; }
.v47-kpi.total { border-top-color:var(--ns-blue-2); } .v47-kpi.risk { border-top-color:var(--critico); }
.v47-projection,.v47-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v47-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v47-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v47-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v47-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v47-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v47-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v47-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v47-board-table th:last-child { border-radius:0 16px 16px 0; }
.v47-board-table th b,.v47-board-table th span { display:block; }
.v47-board-table th span { color:#dbefff; font-size:11px; }
.v47-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v47-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v47-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v47-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v47-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v47-board-table .num { text-align:center; white-space:nowrap; }
.v47-board-table .total-col { background:#d7ebff!important; }
.v47-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v47-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v47-hero,.v47-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v47-section-head{display:grid;} .v47-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v47-page { max-width: 1560px; }
.v47-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v47-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v47-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v47-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v47-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v47-filters { margin:16px 0; }
.v47-filters button { display:none; }
.v47-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v47-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v47-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v47-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v47-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v47-kpi small { color:var(--ns-muted); font-weight:750; }
.v47-kpi.month { border-top-color:var(--ns-orange); } .v47-kpi.year { border-top-color:var(--ns-blue); }
.v47-kpi.current { border-top-color:var(--ok); } .v47-kpi.pending { border-top-color:#ff8300; }
.v47-kpi.total { border-top-color:var(--ns-blue-2); } .v47-kpi.risk { border-top-color:var(--critico); }
.v47-projection,.v47-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v47-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v47-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v47-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v47-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v47-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v47-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v47-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v47-board-table th:last-child { border-radius:0 16px 16px 0; }
.v47-board-table th b,.v47-board-table th span { display:block; }
.v47-board-table th span { color:#dbefff; font-size:11px; }
.v47-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v47-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v47-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v47-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v47-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v47-board-table .num { text-align:center; white-space:nowrap; }
.v47-board-table .total-col { background:#d7ebff!important; }
.v47-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v47-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v47-hero,.v47-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v47-section-head{display:grid;} .v47-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v47-board-table th:first-child,.v47-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v47-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v47-board-table th:first-child,
.v47-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v47-board-table th:not(:first-child),
.v47-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}

/* V45 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v47-page { max-width: 1560px; }
.v47-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v47-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v47-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v47-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v47-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v47-filters { margin:16px 0; }
.v47-filters button { display:none; }
.v47-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v47-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v47-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v47-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v47-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v47-kpi small { color:var(--ns-muted); font-weight:750; }
.v47-kpi.month { border-top-color:var(--ns-orange); } .v47-kpi.year { border-top-color:var(--ns-blue); }
.v47-kpi.current { border-top-color:var(--ok); } .v47-kpi.pending { border-top-color:#ff8300; }
.v47-kpi.total { border-top-color:var(--ns-blue-2); } .v47-kpi.risk { border-top-color:var(--critico); }
.v47-projection,.v47-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v47-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v47-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v47-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v47-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v47-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v47-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v47-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v47-board-table th:last-child { border-radius:0 16px 16px 0; }
.v47-board-table th b,.v47-board-table th span { display:block; }
.v47-board-table th span { color:#dbefff; font-size:11px; }
.v47-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v47-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v47-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v47-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v47-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v47-board-table .num { text-align:center; white-space:nowrap; }
.v47-board-table .total-col { background:#d7ebff!important; }
.v47-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v47-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v47-hero,.v47-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v47-section-head{display:grid;} .v47-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v47-page { max-width: 1560px; }
.v47-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v47-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v47-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v47-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v47-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v47-filters { margin:16px 0; }
.v47-filters button { display:none; }
.v47-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v47-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v47-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v47-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v47-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v47-kpi small { color:var(--ns-muted); font-weight:750; }
.v47-kpi.month { border-top-color:var(--ns-orange); } .v47-kpi.year { border-top-color:var(--ns-blue); }
.v47-kpi.current { border-top-color:var(--ok); } .v47-kpi.pending { border-top-color:#ff8300; }
.v47-kpi.total { border-top-color:var(--ns-blue-2); } .v47-kpi.risk { border-top-color:var(--critico); }
.v47-projection,.v47-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v47-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v47-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v47-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v47-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v47-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v47-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v47-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v47-board-table th:last-child { border-radius:0 16px 16px 0; }
.v47-board-table th b,.v47-board-table th span { display:block; }
.v47-board-table th span { color:#dbefff; font-size:11px; }
.v47-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v47-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v47-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v47-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v47-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v47-board-table .num { text-align:center; white-space:nowrap; }
.v47-board-table .total-col { background:#d7ebff!important; }
.v47-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v47-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v47-hero,.v47-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v47-section-head{display:grid;} .v47-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v47-board-table th:first-child,.v47-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v47-page { max-width: 1560px; }
.v47-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v47-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v47-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v47-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v47-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v47-filters { margin:16px 0; }
.v47-filters button { display:none; }
.v47-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v47-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v47-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v47-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v47-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v47-kpi small { color:var(--ns-muted); font-weight:750; }
.v47-kpi.month { border-top-color:var(--ns-orange); } .v47-kpi.year { border-top-color:var(--ns-blue); }
.v47-kpi.current { border-top-color:var(--ok); } .v47-kpi.pending { border-top-color:#ff8300; }
.v47-kpi.total { border-top-color:var(--ns-blue-2); } .v47-kpi.risk { border-top-color:var(--critico); }
.v47-projection,.v47-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v47-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v47-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v47-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v47-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v47-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v47-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v47-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v47-board-table th:last-child { border-radius:0 16px 16px 0; }
.v47-board-table th b,.v47-board-table th span { display:block; }
.v47-board-table th span { color:#dbefff; font-size:11px; }
.v47-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v47-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v47-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v47-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v47-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v47-board-table .num { text-align:center; white-space:nowrap; }
.v47-board-table .total-col { background:#d7ebff!important; }
.v47-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v47-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v47-hero,.v47-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v47-section-head{display:grid;} .v47-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v47-page { max-width: 1560px; }
.v47-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v47-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v47-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v47-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v47-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v47-filters { margin:16px 0; }
.v47-filters button { display:none; }
.v47-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v47-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v47-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v47-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v47-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v47-kpi small { color:var(--ns-muted); font-weight:750; }
.v47-kpi.month { border-top-color:var(--ns-orange); } .v47-kpi.year { border-top-color:var(--ns-blue); }
.v47-kpi.current { border-top-color:var(--ok); } .v47-kpi.pending { border-top-color:#ff8300; }
.v47-kpi.total { border-top-color:var(--ns-blue-2); } .v47-kpi.risk { border-top-color:var(--critico); }
.v47-projection,.v47-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v47-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v47-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v47-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v47-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v47-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v47-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v47-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v47-board-table th:last-child { border-radius:0 16px 16px 0; }
.v47-board-table th b,.v47-board-table th span { display:block; }
.v47-board-table th span { color:#dbefff; font-size:11px; }
.v47-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v47-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v47-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v47-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v47-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v47-board-table .num { text-align:center; white-space:nowrap; }
.v47-board-table .total-col { background:#d7ebff!important; }
.v47-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v47-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v47-hero,.v47-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v47-section-head{display:grid;} .v47-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v47-board-table th:first-child,.v47-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v47-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v47-board-table th:first-child,
.v47-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v47-board-table th:not(:first-child),
.v47-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}


/* ===== V45: chart only in modal, weekly accumulated bars ===== */
.v47-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v47-board-table th:first-child,
.v47-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v47-board-table th:not(:first-child),
.v47-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}
.modal-chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.modal-chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}


/* ===== V46: single script, modals only for card charts ===== */
.v47-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v47-board-table th:first-child,
.v47-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v47-board-table th:not(:first-child),
.v47-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}


/* ===== V47: aging cards 30/60/90/120 above cartera por cliente ===== */
.v47-aging-cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 18px;
}
.v47-aging-card {
    border: 1px solid var(--ns-line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: center;
    cursor: pointer;
    min-height: 128px;
    position: relative;
    border-top: 7px solid var(--ns-blue-2);
    transition: transform .16s ease, box-shadow .16s ease;
}
.v47-aging-card:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.v47-aging-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v47-aging-card strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px,2vw,30px);
    line-height: 1;
}
.v47-aging-card small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v47-aging-card.d30 { border-top-color: #00a651; }
.v47-aging-card.d60 { border-top-color: #ffbf00; }
.v47-aging-card.d90 { border-top-color: #ff8300; }
.v47-aging-card.d120 { border-top-color: #e32626; }
@media (max-width: 1000px) {
    .v47-aging-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
    .v47-aging-cards { grid-template-columns: 1fr; }
}

/* V48 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v43-page { max-width: 1560px; }
.v43-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v43-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v43-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v43-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v43-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v43-filters { margin:16px 0; }
.v43-filters button { display:none; }
.v43-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v43-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v43-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v43-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v43-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v43-kpi small { color:var(--ns-muted); font-weight:750; }
.v43-kpi.month { border-top-color:var(--ns-orange); } .v43-kpi.year { border-top-color:var(--ns-blue); }
.v43-kpi.current { border-top-color:var(--ok); } .v43-kpi.pending { border-top-color:#ff8300; }
.v43-kpi.total { border-top-color:var(--ns-blue-2); } .v43-kpi.risk { border-top-color:var(--critico); }
.v43-projection,.v43-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v43-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v43-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v43-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v43-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v43-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v43-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v43-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v43-board-table th:last-child { border-radius:0 16px 16px 0; }
.v43-board-table th b,.v43-board-table th span { display:block; }
.v43-board-table th span { color:#dbefff; font-size:11px; }
.v43-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v43-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v43-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v43-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v43-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v43-board-table .num { text-align:center; white-space:nowrap; }
.v43-board-table .total-col { background:#d7ebff!important; }
.v43-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v43-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v43-hero,.v43-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v43-section-head{display:grid;} .v43-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v43-board-table th:first-child,.v43-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v48-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}

/* V45 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v43-page { max-width: 1560px; }
.v43-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v43-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v43-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v43-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v43-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v43-filters { margin:16px 0; }
.v43-filters button { display:none; }
.v43-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v43-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v43-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v43-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v43-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v43-kpi small { color:var(--ns-muted); font-weight:750; }
.v43-kpi.month { border-top-color:var(--ns-orange); } .v43-kpi.year { border-top-color:var(--ns-blue); }
.v43-kpi.current { border-top-color:var(--ok); } .v43-kpi.pending { border-top-color:#ff8300; }
.v43-kpi.total { border-top-color:var(--ns-blue-2); } .v43-kpi.risk { border-top-color:var(--critico); }
.v43-projection,.v43-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v43-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v43-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v43-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v43-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v43-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v43-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v43-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v43-board-table th:last-child { border-radius:0 16px 16px 0; }
.v43-board-table th b,.v43-board-table th span { display:block; }
.v43-board-table th span { color:#dbefff; font-size:11px; }
.v43-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v43-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v43-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v43-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v43-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v43-board-table .num { text-align:center; white-space:nowrap; }
.v43-board-table .total-col { background:#d7ebff!important; }
.v43-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v43-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v43-hero,.v43-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v43-section-head{display:grid;} .v43-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v43-board-table th:first-child,.v43-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v48-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}


/* ===== V45: chart only in modal, weekly accumulated bars ===== */
.v48-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}
.modal-chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.modal-chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}

/* V46 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v48-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}

/* V45 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v48-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}


/* ===== V45: chart only in modal, weekly accumulated bars ===== */
.v48-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}
.modal-chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.modal-chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}


/* ===== V46: single script, modals only for card charts ===== */
.v48-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}

/* V47 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v43-page { max-width: 1560px; }
.v43-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v43-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v43-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v43-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v43-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v43-filters { margin:16px 0; }
.v43-filters button { display:none; }
.v43-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v43-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v43-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v43-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v43-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v43-kpi small { color:var(--ns-muted); font-weight:750; }
.v43-kpi.month { border-top-color:var(--ns-orange); } .v43-kpi.year { border-top-color:var(--ns-blue); }
.v43-kpi.current { border-top-color:var(--ok); } .v43-kpi.pending { border-top-color:#ff8300; }
.v43-kpi.total { border-top-color:var(--ns-blue-2); } .v43-kpi.risk { border-top-color:var(--critico); }
.v43-projection,.v43-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v43-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v43-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v43-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v43-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v43-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v43-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v43-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v43-board-table th:last-child { border-radius:0 16px 16px 0; }
.v43-board-table th b,.v43-board-table th span { display:block; }
.v43-board-table th span { color:#dbefff; font-size:11px; }
.v43-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v43-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v43-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v43-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v43-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v43-board-table .num { text-align:center; white-space:nowrap; }
.v43-board-table .total-col { background:#d7ebff!important; }
.v43-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v43-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v43-hero,.v43-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v43-section-head{display:grid;} .v43-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v43-board-table th:first-child,.v43-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v48-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}

/* V45 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v43-page { max-width: 1560px; }
.v43-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v43-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v43-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v43-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v43-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v43-filters { margin:16px 0; }
.v43-filters button { display:none; }
.v43-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v43-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v43-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v43-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v43-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v43-kpi small { color:var(--ns-muted); font-weight:750; }
.v43-kpi.month { border-top-color:var(--ns-orange); } .v43-kpi.year { border-top-color:var(--ns-blue); }
.v43-kpi.current { border-top-color:var(--ok); } .v43-kpi.pending { border-top-color:#ff8300; }
.v43-kpi.total { border-top-color:var(--ns-blue-2); } .v43-kpi.risk { border-top-color:var(--critico); }
.v43-projection,.v43-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v43-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v43-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v43-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v43-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v43-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v43-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v43-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v43-board-table th:last-child { border-radius:0 16px 16px 0; }
.v43-board-table th b,.v43-board-table th span { display:block; }
.v43-board-table th span { color:#dbefff; font-size:11px; }
.v43-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v43-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v43-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v43-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v43-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v43-board-table .num { text-align:center; white-space:nowrap; }
.v43-board-table .total-col { background:#d7ebff!important; }
.v43-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v43-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v43-hero,.v43-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v43-section-head{display:grid;} .v43-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v43-board-table th:first-child,.v43-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v42-page { max-width: 1560px; }
.v42-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v42-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v42-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v42-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v42-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v42-filters { margin:16px 0; }
.v42-filters button { display:none; }
.v42-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v42-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v42-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v42-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v42-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v42-kpi small { color:var(--ns-muted); font-weight:750; }
.v42-kpi.month { border-top-color:var(--ns-orange); } .v42-kpi.year { border-top-color:var(--ns-blue); }
.v42-kpi.current { border-top-color:var(--ok); } .v42-kpi.pending { border-top-color:#ff8300; }
.v42-kpi.total { border-top-color:var(--ns-blue-2); } .v42-kpi.risk { border-top-color:var(--critico); }
.v42-projection,.v42-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v42-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v42-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v42-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v42-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v42-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v42-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v42-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v42-board-table th:last-child { border-radius:0 16px 16px 0; }
.v42-board-table th b,.v42-board-table th span { display:block; }
.v42-board-table th span { color:#dbefff; font-size:11px; }
.v42-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v42-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v42-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v42-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v42-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v42-board-table .num { text-align:center; white-space:nowrap; }
.v42-board-table .total-col { background:#d7ebff!important; }
.v42-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v42-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v42-hero,.v42-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v42-section-head{display:grid;} .v42-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v48-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}


/* ===== V45: chart only in modal, weekly accumulated bars ===== */
.v48-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}
.modal-chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.modal-chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}

/* V46 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v48-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}

/* V45 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}

/* V44 aliases */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* ===== V43 functional fixes ===== */
:root {
    --ns-blue: #003f88;
    --ns-blue-2: #0072ce;
    --ns-orange: #ff8300;
    --ns-orange-2: #ffb000;
    --ns-ink: #05182e;
    --ns-muted: #63758a;
    --ns-line: #d7e6f4;
    --ok: #00a651;
    --alerta: #ffd400;
    --critico: #e32626;
}

* { box-sizing: border-box; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes softPulse {
    0%, 100% { box-shadow: 0 20px 52px rgba(0,63,136,.10); }
    50% { box-shadow: 0 28px 78px rgba(255,131,0,.20); }
}

@keyframes shine {
    from { transform: translateX(-120%); }
    to { transform: translateX(160%); }
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background:
        radial-gradient(circle at top right, rgba(255,131,0,.20), transparent 30%),
        radial-gradient(circle at top left, rgba(0,114,206,.20), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f8ff 58%, #fff8ea 100%);
    color: var(--ns-ink);
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
}

.page-shell { max-width: 1700px; margin: 0 auto; padding: 22px; }

.hero {
    display: flex; justify-content: space-between; align-items: stretch; gap: 18px;
    padding: 26px; border-radius: 30px;
    background: linear-gradient(135deg, var(--ns-blue), #061b39 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 26px 80px rgba(0,63,136,.25); position: relative; overflow: hidden;
    animation: fadeUp .55s ease both;
}
.hero:before,
.hero:after {
    content: ""; position: absolute; border-radius: 999px; pointer-events: none;
}
.hero:before { right: -90px; top: -120px; width: 360px; height: 360px; background: rgba(255,255,255,.12); }
.hero:after { left: 30%; bottom: -120px; width: 240px; height: 240px; background: rgba(255,176,0,.12); }

.eyebrow { margin: 0 0 6px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero h1 { margin: 0; font-size: clamp(34px, 5vw, 66px); letter-spacing: -2.2px; line-height: .95; font-weight: 950; }
.subtitle { margin: 12px 0 0; color: #dbefff; font-weight: 700; }

.hero-badge {
    min-width: 205px; border-radius: 24px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24);
    padding: 18px; display: grid; place-items: center; text-align: center; z-index: 1;
    backdrop-filter: blur(8px);
}
.hero-badge span { font-size: 12px; text-transform: uppercase; font-weight: 900; color: #ffe1b8; }
.hero-badge strong { font-size: 42px; line-height: 1; }
.hero-badge small { font-size: 20px; font-weight: 950; }

.filters {
    display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 18px 0; padding: 16px;
    border-radius: 24px; background: rgba(255,255,255,.88); border: 1px solid var(--ns-line);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
}
.filters label { display: grid; gap: 5px; }
.filters span { color: var(--ns-blue); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; }
.filters select {
    height: 46px; min-width: 110px; border-radius: 14px; border: 1px solid #c8d7e6; background: #fff; padding: 0 12px;
    font-size: 15px; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s ease, border-color .2s ease;
}
.filters select:focus { outline: none; border-color: var(--ns-orange); box-shadow: inset 0 0 0 1px var(--ns-orange), 0 0 0 4px rgba(255,131,0,.12); }
.filters .week-select select { min-width: 360px; }
.filters button, .detail-btn {
    height: 46px; border: 0; border-radius: 14px; padding: 0 18px; background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500; font-weight: 950; box-shadow: 0 14px 30px rgba(255,131,0,.25); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease;
}
.filters button:hover, .detail-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 35px rgba(255,131,0,.35); }

.cards-grid { display: grid; grid-template-columns: repeat(8, minmax(150px, 1fr)); gap: 12px; }
.metric-card {
    position: relative; overflow: hidden; min-height: 152px; border: 1px solid var(--ns-line); border-radius: 24px; background: rgba(255,255,255,.96);
    box-shadow: 0 20px 52px rgba(0,63,136,.10); padding: 16px; text-align: left; cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; animation: riseIn .65s ease both;
}
.metric-card:nth-child(1) { animation-delay: .03s; }
.metric-card:nth-child(2) { animation-delay: .07s; }
.metric-card:nth-child(3) { animation-delay: .11s; }
.metric-card:nth-child(4) { animation-delay: .15s; }
.metric-card:nth-child(5) { animation-delay: .19s; }
.metric-card:nth-child(6) { animation-delay: .23s; }
.metric-card:nth-child(7) { animation-delay: .27s; }
.metric-card:nth-child(8) { animation-delay: .31s; }
.metric-card:hover { transform: translateY(-4px) scale(1.01); box-shadow: 0 28px 70px rgba(0,63,136,.18); border-color: rgba(255,131,0,.55); }
.metric-card:before { content: ""; position: absolute; inset: 0 0 auto 0; height: 7px; background: var(--ns-blue-2); }
.metric-card.ok:before { background: var(--ok); }
.metric-card.alerta:before { background: var(--alerta); }
.metric-card.critico:before { background: var(--critico); }
.metric-card.info:before { background: var(--ns-blue-2); }
.metric-card span { display: block; color: var(--ns-blue); font-size: 12px; font-weight: 950; text-transform: uppercase; letter-spacing: .04em; }
.metric-card strong { display: block; margin: 16px 0 8px; color: var(--ns-blue); font-size: 28px; line-height: 1; letter-spacing: -1.2px; font-weight: 950; }
.metric-card small { display: block; min-height: 34px; color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.metric-card i,
.pill {
    display: inline-block; border-radius: 999px; padding: 5px 10px; background: #e8f3ff; color: var(--ns-blue);
    font-size: 10px; font-style: normal; font-weight: 950;
}
.metric-card.ok i, .pill.ok { background: #d9f7e8; color: #006b37; }
.metric-card.alerta i, .pill.alerta { background: #fff1a8; color: #735100; }
.metric-card.critico i, .pill.critico { background: #ffe0de; color: #a40000; }
.pill.info { background: #e8f3ff; color: var(--ns-blue); }

.dashboard-grid {
    display: grid; grid-template-columns: minmax(250px, .95fr) minmax(430px, 1.25fr) minmax(650px, 1.8fr);
    gap: 18px; margin-top: 18px; align-items: stretch;
}
.week-panel, .center-card, .wide-card, .detail-zone {
    border: 1px solid var(--ns-line); border-radius: 28px; background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10); overflow: hidden;
}
.panel-equal { min-height: 560px; }
.scroll-panel { max-height: 510px; overflow: auto; }
.table-panel { max-height: 560px; }
.section-title {
    background: linear-gradient(135deg, #061b39, var(--ns-blue)); color: #fff; padding: 12px 16px; font-size: 14px;
    text-align: center; text-transform: uppercase; letter-spacing: .08em; font-weight: 950; position: sticky; top: 0; z-index: 2;
}
.section-title.blue-orange { background: linear-gradient(90deg, #061b39, var(--ns-blue), var(--ns-orange)); }
.week-panel { padding-bottom: 12px; }
.week-chip {
    display: grid; gap: 6px; margin: 12px; padding: 14px; text-decoration: none; color: var(--ns-ink);
    border-radius: 20px; border: 1px solid var(--ns-line); border-left: 9px solid var(--ns-blue-2); background: #fff;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    animation: fadeUp .45s ease both; animation: riseIn .55s ease both;
}
.week-chip:hover { transform: translateX(4px); box-shadow: 0 16px 32px rgba(0,63,136,.08); }
.week-chip.ok { border-left-color: var(--ok); }
.week-chip.alerta { border-left-color: var(--alerta); }
.week-chip.critico { border-left-color: var(--critico); }
.week-chip.selected { outline: 3px solid var(--ns-orange); animation: pulseGlow 2.5s ease-in-out infinite; }
.week-chip b { color: var(--ns-blue); font-size: 22px; }
.week-chip span, .week-chip small { color: var(--ns-muted); font-size: 12px; font-weight: 700; }
.week-chip strong { color: var(--ns-blue); font-size: 18px; font-weight: 950; }
.week-chip em { justify-self: start; background: #edf6ff; border-radius: 999px; padding: 4px 9px; font-style: normal; font-size: 10px; font-weight: 950; color: var(--ns-blue); }

.indicator-list { padding: 16px 20px 22px; }
.indicator-row {
    display: grid; grid-template-columns: minmax(180px, 1fr) 52px minmax(110px, 130px) 88px; gap: 10px; align-items: center;
    padding: 11px 0; border-bottom: 1px solid #edf3f8;
}
.indicator-row span { text-align: right; color: #20384d; font-weight: 750; }
.indicator-row b { color: var(--ns-blue); text-align: center; }
.indicator-row strong { color: var(--ns-blue); text-align: right; font-size: 16px; }

.wide-card { min-height: 100%; }
.center-card { min-height: 100%; }
.week-panel { min-height: 100%; }
.pretty-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pretty-table th { position: sticky; top: 0; padding: 10px 8px; background: #e8f4ff; color: var(--ns-blue); text-align: left; font-weight: 950; border-bottom: 2px solid #c6dff4; }
.pretty-table td { padding: 10px 8px; border-bottom: 1px solid #edf3f8; }
.pretty-table tr.ok td { background: #f4fff8; }
.pretty-table tr.alerta td { background: #fffdf0; }
.pretty-table tr.critico td { background: #fff7f7; }
.pretty-table tr.selected-row td { outline: 2px solid var(--ns-orange); outline-offset: -2px; }
.num { text-align: right; color: var(--ns-blue); font-weight: 900; white-space: nowrap; }

.detail-zone { margin-top: 18px; padding: 16px; }
#detailTable { margin-top: 14px; max-height: 560px; overflow: auto; border-radius: 18px; border: 1px solid var(--ns-line); }
.hidden { display: none !important; }

.q-modal {
    position: fixed; inset: 0; z-index: 100; background: rgba(2,12,25,.55); display: grid; place-items: center; padding: 20px;
}
.q-modal-card {
    position: relative; width: min(1120px, 96vw); max-height: 88vh; overflow: auto; background: #fff; border-radius: 28px;
    box-shadow: 0 35px 110px rgba(0,0,0,.38); padding: 22px; animation: popIn .25s ease;
}
.q-modal-card h2 { margin: 0 50px 18px 0; color: var(--ns-blue); font-size: 30px; }
.modal-x {
    position: absolute; right: 18px; top: 16px; width: 42px; height: 42px; border: 0; border-radius: 14px;
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2)); font-size: 26px; font-weight: 950; cursor: pointer;
}
.modal-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.modal-table th { padding: 10px; background: linear-gradient(90deg, var(--ns-blue), var(--ns-blue-2)); color: white; text-align: left; }
.modal-table td { padding: 9px 10px; border-bottom: 1px solid #edf3f8; }
.modal-table tr.ok td { background: #f4fff8; }
.modal-table tr.alerta td { background: #fffdf0; }
.modal-table tr.critico td { background: #fff7f7; }

.fade-up { animation: riseIn .7s ease both; }
.delay-1 { animation-delay: .08s; }
.delay-2 { animation-delay: .16s; }
.delay-3 { animation-delay: .24s; }
.floaty { animation: floatUp 3.6s ease-in-out infinite; }

@keyframes riseIn {
    from { opacity: 0; transform: translateY(18px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes popIn {
    from { opacity: 0; transform: scale(.97); }
    to { opacity: 1; transform: scale(1); }
}
@keyframes pulseGlow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,131,0,.25); }
    50% { box-shadow: 0 0 0 8px rgba(255,131,0,.10); }
}
@keyframes floatUp {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

@media (max-width: 1560px) {
    .cards-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1420px) {
    .dashboard-grid { grid-template-columns: 1fr; }
    .panel-equal { min-height: auto; }
    .scroll-panel, .table-panel { max-height: none; }
}
@media (max-width: 900px) {
    .cards-grid { grid-template-columns: repeat(2, 1fr); }
    .filters .week-select select { min-width: 100%; }
}
@media (max-width: 720px) {
    .page-shell { padding: 12px; }
    .hero { flex-direction: column; padding: 20px; }
    .cards-grid { grid-template-columns: 1fr; }
    .indicator-row { grid-template-columns: 1fr; }
    .indicator-row span, .indicator-row strong { text-align: left; }
}


/* ===== V9 layout corrections ===== */
.cards-grid {
    grid-template-columns: repeat(auto-fit, minmax(205px, 1fr));
    align-items: stretch;
}

.metric-card {
    min-height: 134px;
}

.dashboard-grid {
    grid-template-columns: minmax(265px, 18%) minmax(440px, 29%) minmax(640px, 1fr);
    align-items: start;
}

.week-panel {
    overflow: visible !important;
    max-height: none !important;
    height: auto !important;
}

.week-chip {
    margin: 8px 12px;
    padding: 10px 12px;
    gap: 3px;
    min-height: 86px;
}

.week-chip b {
    font-size: 20px;
}

.week-chip strong {
    font-size: 16px;
}

.week-chip span,
.week-chip small {
    font-size: 11px;
}

.center-card .indicator-list {
    padding: 16px 18px;
}

.indicator-row {
    grid-template-columns: 1.2fr 50px 120px 82px;
    padding: 10px 0;
}

.wide-card {
    overflow-x: auto;
}

.pretty-table th,
.pretty-table td {
    white-space: nowrap;
}

.metric-card:nth-child(1) { animation-delay: .02s; }
.metric-card:nth-child(2) { animation-delay: .05s; }
.metric-card:nth-child(3) { animation-delay: .08s; }
.metric-card:nth-child(4) { animation-delay: .11s; }
.metric-card:nth-child(5) { animation-delay: .14s; }
.metric-card:nth-child(6) { animation-delay: .17s; }
.metric-card:nth-child(7) { animation-delay: .20s; }
.metric-card:nth-child(8) { animation-delay: .23s; }
.metric-card:nth-child(9) { animation-delay: .26s; }

.week-chip {
    animation: fadeUp .45s ease both;
}

.week-chip:nth-child(2) { animation-delay: .05s; }
.week-chip:nth-child(3) { animation-delay: .09s; }
.week-chip:nth-child(4) { animation-delay: .13s; }
.week-chip:nth-child(5) { animation-delay: .17s; }
.week-chip:nth-child(6) { animation-delay: .21s; }

@media (min-width: 1500px) {
    .cards-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 1420px) {
    .cards-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== V12: semanas sin contenedor con scrollbar y menos infotarjetas ===== */

.compact-hero {
    padding: 20px 24px;
}

.compact-filters {
    margin: 14px 0;
}

.lean-cards {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.weeks-board {
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: visible;
    margin: 16px 0 18px;
    animation: fadeUp .55s ease both;
}

.weeks-board .section-title {
    border-radius: 28px 28px 0 0;
}

.weeks-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
    gap: 12px;
    padding: 14px;
    overflow: visible;
}

.weeks-grid .week-chip {
    margin: 0;
    min-height: 116px;
}

.week-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
}

.no-week-column {
    grid-template-columns: minmax(420px, 33%) minmax(640px, 1fr);
    align-items: stretch;
}

.no-week-column .center-card,
.no-week-column .wide-card {
    min-height: 100%;
}

.no-week-column .indicator-row {
    grid-template-columns: 1.25fr 52px 132px 82px;
}

@media (min-width: 1500px) {
    .lean-cards {
        grid-template-columns: repeat(6, 1fr);
    }
}

@media (max-width: 1180px) {
    .no-week-column {
        grid-template-columns: 1fr;
    }

    .weeks-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}


/* ===== V13: total del mes + diseño/animación mejorados ===== */

@keyframes floatIn {
    from { opacity: 0; transform: translateY(16px) scale(.985); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes glowBlueOrange {
    0%, 100% { box-shadow: 0 22px 60px rgba(0,63,136,.12); }
    50% { box-shadow: 0 28px 88px rgba(255,131,0,.24); }
}

@keyframes borderSweep {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.hero {
    position: relative;
    isolation: isolate;
}

.hero:before {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,131,0,.26), rgba(0,114,206,.18), rgba(255,255,255,.10));
    background-size: 200% 100%;
    animation: borderSweep 8s linear infinite;
    z-index: -1;
}

.hero-side {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    min-width: 230px;
    z-index: 1;
}

.hero-total {
    border-radius: 20px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.24);
    padding: 14px;
    text-align: center;
    backdrop-filter: blur(12px);
}

.hero-total span {
    display: block;
    color: #ffe1b8;
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .08em;
}

.hero-total strong {
    display: block;
    font-size: 22px;
    line-height: 1;
    margin: 7px 0 4px;
}

.hero-total small {
    display: inline-block;
    border-radius: 999px;
    background: rgba(255,255,255,.20);
    padding: 4px 9px;
    font-weight: 950;
}

.metric-card,
.weeks-board,
.center-card,
.wide-card,
.detail-zone {
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.metric-card {
    border-radius: 26px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92)),
        radial-gradient(circle at top right, rgba(255,131,0,.12), transparent 35%);
}

.metric-card:hover,
.month-total-card:hover {
    animation: glowBlueOrange 1.4s ease-in-out infinite;
}

.metric-card strong {
    font-size: clamp(24px, 2vw, 32px);
}

.weeks-board,
.center-card,
.wide-card {
    border: 1px solid rgba(0,63,136,.14);
}

.week-chip {
    background:
        linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 12px 30px rgba(0,63,136,.07);
}

.week-chip:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 44px rgba(0,63,136,.15);
}

.pretty-table tr {
    transition: transform .12s ease, filter .12s ease, background .12s ease;
}

.pretty-table tbody tr:hover td {
    filter: brightness(.985);
    transform: translateY(-1px);
}

.month-total-row td {
    background: linear-gradient(90deg, rgba(0,63,136,.08), rgba(255,131,0,.10)) !important;
    border-top: 3px solid var(--ns-orange);
    border-bottom: 3px solid var(--ns-orange);
    font-weight: 950;
}

.month-total-card {
    margin: 16px;
    padding: 18px;
    border-radius: 26px;
    background:
        linear-gradient(135deg, #06254a, var(--ns-blue) 45%, var(--ns-orange));
    color: white;
    display: grid;
    grid-template-columns: minmax(250px, 1.4fr) repeat(4, minmax(130px, .7fr));
    gap: 14px;
    align-items: center;
    box-shadow: 0 24px 70px rgba(0,63,136,.22);
    cursor: pointer;
    position: relative;
    overflow: hidden;
}

.month-total-card:after {
    content: "";
    position: absolute;
    inset: 0;
    width: 42%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
    transform: translateX(-120%);
    pointer-events: none;
}

.month-total-card:hover:after {
    animation: shine .9s ease;
}

.month-total-card span {
    display: block;
    color: #ffe8c7;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
}

.month-total-card strong {
    display: block;
    margin: 6px 0 4px;
    font-size: clamp(28px, 3vw, 44px);
    line-height: .95;
    letter-spacing: -1.4px;
}

.month-total-card small {
    color: #dceeff;
    font-weight: 750;
}

.total-mini {
    border-radius: 18px;
    background: rgba(255,255,255,.15);
    border: 1px solid rgba(255,255,255,.20);
    padding: 12px;
    min-height: 74px;
}

.total-mini b {
    display: block;
    margin-top: 8px;
    font-size: 18px;
}

@media (max-width: 1280px) {
    .month-total-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .hero-side {
        grid-template-columns: 1fr 1fr;
        min-width: 0;
    }

    .month-total-card {
        grid-template-columns: 1fr;
    }
}

/* ===== V14 acumulado ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}


/* ===== V15 Acumulado navegable y validación diaria ===== */

.top-nav-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.top-nav-tabs a {
    text-decoration: none;
    border-radius: 999px;
    padding: 10px 16px;
    background: rgba(255,255,255,.88);
    border: 1px solid var(--ns-line);
    color: var(--ns-blue);
    font-weight: 950;
    box-shadow: 0 10px 26px rgba(0,63,136,.08);
}

.top-nav-tabs a.active {
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    color: white;
}

.date-input {
    height: 44px;
    min-width: 160px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.acumulado-board,
.formula-board {
    margin-top: 18px;
    border: 1px solid var(--ns-line);
    border-radius: 28px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 22px 60px rgba(0,63,136,.10);
    overflow: hidden;
    animation: floatIn .48s cubic-bezier(.2,.8,.2,1) both;
}

.acumulado-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.acumulado-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    font-size: 13px;
}

.acumulado-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    text-align: center;
    border: 1px solid #c8dfef;
    font-weight: 950;
}

.acumulado-table th.acumulado {
    background: linear-gradient(135deg, #e7f1ff, #d7e8ff);
    outline: 3px solid var(--ns-blue);
    outline-offset: -3px;
}

.acumulado-table th.al_corte {
    background: linear-gradient(135deg, #fff4df, #ffe4ba);
    outline: 3px solid var(--ns-orange);
    outline-offset: -3px;
}

.acumulado-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
}

.acumulado-table .concept-col {
    min-width: 190px;
}

.acumulado-table td:first-child {
    font-weight: 850;
    color: #1d354d;
    background: #fbfdff;
}

.acumulado-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
}

.acumulado-table .strong-value {
    font-weight: 950;
}

.cumplimiento-row td {
    background: #f2f2f2;
    font-weight: 950;
}

.cumplimiento-row td.ok {
    background: #d9f7e8;
    color: #006b37;
}

.cumplimiento-row td.alerta {
    background: #fff1a8;
    color: #735100;
}

.cumplimiento-row td.critico {
    background: #ffe0de;
    color: #a40000;
}

.formula-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 14px;
    padding: 16px;
}

.formula-card {
    border-radius: 22px;
    border: 1px solid var(--ns-line);
    background:
        linear-gradient(180deg, #ffffff, #f9fcff),
        radial-gradient(circle at top right, rgba(255,131,0,.10), transparent 34%);
    padding: 16px;
    box-shadow: 0 16px 38px rgba(0,63,136,.08);
}

.formula-card span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.formula-card strong {
    display: block;
    margin: 8px 0;
    color: var(--ns-blue);
    font-size: 18px;
}

.formula-card p {
    margin: 0;
    color: var(--ns-muted);
    font-weight: 650;
}

.modal-formula h3 {
    color: var(--ns-blue);
}

/* ===== V17 Proveedores acumulado ===== */

.proveedores-page .provider-filter {
    min-width: 280px;
    flex: 1 1 280px;
}

.proveedores-page .provider-filter input {
    width: 100%;
    height: 44px;
    border: 1px solid #c8d7e6;
    border-radius: 14px;
    padding: 0 12px;
    font-size: 15px;
    background: #fff;
}

.proveedores-board {
    margin-top: 18px;
    overflow: hidden;
}

.proveedores-table-wrap {
    overflow-x: auto;
    padding: 16px;
}

.proveedores-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: collapse;
    font-size: 12px;
}

.proveedores-table th {
    background: #e8f4ff;
    color: var(--ns-blue);
    padding: 10px 8px;
    border: 1px solid #c8dfef;
    text-align: center;
    font-weight: 950;
    white-space: nowrap;
}

.proveedores-table td {
    padding: 9px 8px;
    border: 1px solid #e2edf5;
    vertical-align: middle;
}

.proveedores-table tbody tr {
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.proveedores-table tbody tr:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(0,63,136,.09);
    filter: brightness(.99);
}

.proveedores-table .provider-name {
    min-width: 260px;
    color: var(--ns-blue);
}

.proveedores-table .provider-name b {
    display: block;
    font-size: 13px;
}

.proveedores-table .provider-name small {
    display: block;
    color: var(--ns-muted);
    margin-top: 3px;
}

.proveedores-table .num {
    text-align: right;
    color: var(--ns-blue);
    font-weight: 850;
    white-space: nowrap;
}

.proveedores-table .strong-value {
    font-weight: 950;
    font-size: 13px;
}

.proveedores-table .alerta-cell {
    background: #fff8df;
    color: #8b5b00;
}

.proveedores-table .critico-cell {
    background: #ffe5e1;
    color: #a40000;
}

.proveedores-table .note-cell {
    min-width: 220px;
    max-width: 320px;
    color: #41566c;
    font-size: 11px;
}

.relation-btn {
    border: none;
    border-radius: 999px;
    padding: 9px 13px;
    font-weight: 950;
    cursor: pointer;
    color: white;
    background: linear-gradient(135deg, var(--ns-blue), var(--ns-orange));
    box-shadow: 0 12px 26px rgba(0,63,136,.18);
    white-space: nowrap;
}

.relation-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 36px rgba(0,63,136,.25);
}

.provider-modal-card {
    max-width: min(1180px, 96vw);
}

.provider-modal-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-modal-summary div {
    padding: 13px;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border: 1px solid var(--ns-line);
}

.provider-modal-summary span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.provider-modal-summary b {
    display: block;
    color: var(--ns-blue);
    font-size: 22px;
    margin-top: 5px;
}

.modal-subtitle {
    margin: 18px 0 10px;
    color: var(--ns-blue);
    font-size: 18px;
}

.modal-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}

.empty-state {
    padding: 18px;
    border: 1px dashed var(--ns-line);
    border-radius: 18px;
    color: var(--ns-muted);
    font-weight: 750;
    background: #fbfdff;
}

@media (max-width: 900px) {
    .proveedores-page .provider-filter {
        min-width: 100%;
    }
}


/* ===== V18 Proveedores listado completo ===== */

.provider-select {
    height: 44px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
    min-width: 420px;
}

.clear-filter-btn {
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    text-decoration: none;
    background: #eaf4ff;
    border: 1px solid #bcd7ef;
    color: var(--ns-blue);
    font-weight: 950;
    white-space: nowrap;
}

.clear-filter-btn:hover {
    background: #dbeeff;
}

.empty-table-cell {
    text-align: center;
    color: var(--ns-muted);
    padding: 24px !important;
    font-weight: 850;
}

.proveedores-table tbody tr.ok .provider-name b {
    color: #0d3c6e;
}

.proveedores-table tbody tr.ok td {
    background: rgba(255,255,255,.98);
}

.proveedores-table tbody tr.ok:hover td {
    background: #f6fbff;
}

@media (max-width: 900px) {
    .provider-select {
        min-width: 0;
    }
}


/* ===== V19 Proveedores dinámico ===== */

.proveedores-table.week-matrix th,
.proveedores-table.week-matrix td {
    min-width: 140px;
}

.proveedores-table.week-matrix td:first-child {
    min-width: 90px;
    text-align: center;
}

.proveedores-table td small {
    display: block;
    color: #60748a;
    font-size: 11px;
    margin-top: 3px;
}

.provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.source-actions {
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.source-actions span {
    color: var(--ns-muted);
    font-weight: 750;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .provider-filter input {
        min-width: 0;
    }
}


/* ===== V20 Cartera clientes ===== */

.cartera-hero {
    background:
        radial-gradient(circle at 40% 100%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #05234b 0%, #003f88 45%, #ff8300 100%);
}

.cartera-board {
    margin-top: 18px;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 900px) {
    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V22 Cartera ejecutiva simplificada ===== */

.cartera-v22 .executive-hero {
    min-height: 220px;
    background:
        radial-gradient(circle at 42% 110%, rgba(255,255,255,.14), transparent 20%),
        linear-gradient(135deg, #05234b 0%, #003f88 48%, #ff8300 100%);
}

.kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 14px;
    margin: 16px 0;
}

.kpi-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    padding: 16px;
    box-shadow: 0 18px 44px rgba(0,63,136,.10);
    border-top: 6px solid var(--ns-blue);
    animation: floatIn .38s ease both;
}

.kpi-card.ok { border-top-color: var(--ok); }
.kpi-card.info { border-top-color: var(--ns-blue-2); }
.kpi-card.alerta { border-top-color: var(--alerta); }
.kpi-card.critico { border-top-color: var(--critico); }

.kpi-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .06em;
}

.kpi-card strong {
    display: block;
    margin-top: 8px;
    font-size: clamp(28px, 3vw, 42px);
    color: var(--ns-blue);
    letter-spacing: -1.5px;
}

.kpi-card small {
    color: var(--ns-muted);
    font-weight: 750;
}

.executive-grid {
    display: grid;
    grid-template-columns: minmax(520px, 1.4fr) minmax(380px, .8fr);
    gap: 18px;
    margin: 18px 0;
}

.chart-card,
.monthly-card {
    overflow: hidden;
}

.chart-wrap {
    padding: 16px 20px 20px;
    height: 310px;
}

#carteraMonthlyChart {
    width: 100%;
    height: 260px;
    display: block;
}

.mini-exec-table {
    width: calc(100% - 32px);
    margin: 16px;
    border-collapse: collapse;
    font-size: 13px;
}

.mini-exec-table th {
    background: #e7f2ff;
    color: var(--ns-blue);
    padding: 10px;
    border: 1px solid #c9dfef;
    text-align: right;
}

.mini-exec-table th:first-child {
    text-align: left;
}

.mini-exec-table td {
    padding: 10px;
    border: 1px solid #e2edf5;
}

.mini-exec-table .num {
    text-align: right;
    font-weight: 850;
    color: var(--ns-blue);
}

.projection-simplified .relation-btn {
    display: none;
}

.helper-line {
    padding: 12px 16px 0;
    color: var(--ns-muted);
    font-weight: 750;
}

.cartera-projection th {
    min-width: 145px;
}

.cartera-projection th:first-child,
.cartera-projection td:first-child {
    min-width: 360px;
}

.cartera-projection td.num {
    background: #e6f1fb;
}

.cartera-projection tbody tr:nth-child(even) td.num {
    background: #f7fbff;
}

.cartera-filters .provider-filter input {
    height: 44px;
    width: 100%;
    min-width: 420px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    background: #fff;
    padding: 0 12px;
    font-size: 15px;
}

.provider-summary-modal {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

.provider-summary-modal div {
    border-radius: 16px;
    background: #f4f8fc;
    border: 1px solid #d9e8f5;
    padding: 12px;
}

.provider-summary-modal span {
    display: block;
    color: var(--ns-orange);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
    letter-spacing: .07em;
}

.provider-summary-modal b {
    display: block;
    color: var(--ns-blue);
    font-size: 18px;
    margin-top: 4px;
}

.modal-filterbar {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 10px;
    margin: 12px 0;
}

.modal-filterbar input,
.modal-filterbar select {
    height: 42px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #fff;
    color: var(--ns-ink);
    font-weight: 700;
}

.modal-table td {
    white-space: nowrap;
}

@media (max-width: 1100px) {
    .executive-grid {
        grid-template-columns: 1fr;
    }

    .kpi-strip {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 760px) {
    .kpi-strip {
        grid-template-columns: 1fr;
    }

    .modal-filterbar {
        grid-template-columns: 1fr;
    }

    .cartera-filters .provider-filter input {
        min-width: 0;
    }
}


/* ===== V25 UI ejecutiva, logo global y detalles dinámicos ===== */
.global-brand-logo {
    position: fixed;
    top: 16px;
    right: 18px;
    z-index: 60;
    width: 96px;
    height: auto;
    display: block;
    filter: drop-shadow(0 12px 24px rgba(0,63,136,.18));
}
.global-brand-logo img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 18px;
}
.page-shell {
    padding-top: 28px;
}
.hero-logo-quell {
    position: relative;
    z-index: 2;
    width: 118px;
    align-self: flex-start;
    border-radius: 22px;
    background: #fff;
    padding: 8px;
    box-shadow: 0 18px 42px rgba(0,0,0,.18);
}
.cartera-v25 .executive-hero {
    min-height: 205px;
    padding-right: 160px;
}
.cartera-v25 .subtitle {
    max-width: 780px;
}
.kpi-card {
    border: 0;
    text-align: left;
    cursor: pointer;
}
.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 60px rgba(0,63,136,.16);
}
.section-title-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}
.mini-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.ghost-action {
    border: 1px solid rgba(0,63,136,.22);
    background: rgba(255,255,255,.92);
    color: var(--ns-blue);
    border-radius: 999px;
    font-weight: 950;
    padding: 8px 12px;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ghost-action.light {
    border-color: rgba(255,255,255,.45);
}
.ghost-action:hover,
.ghost-action.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #1f1600;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(255,131,0,.24);
}
.clickable-row {
    cursor: pointer;
}
.clickable-row:hover td {
    background: #fff4df !important;
}
.clickable-chart {
    cursor: pointer;
}
.detail-picker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 14px 16px 0;
    color: var(--ns-muted);
    font-weight: 800;
}
.detail-picker select {
    min-width: 340px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #c8d7e6;
    padding: 0 12px;
    color: var(--ns-blue);
    font-weight: 850;
    background: white;
}
.modal-table tbody tr {
    cursor: default;
}
.executive-note {
    display: none;
}
.formula-board {
    display: none !important;
}
.top-nav-tabs a[href*="Proveedores"] {
    display: none !important;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 76px;
        right: 10px;
        top: 10px;
    }
    .hero-logo-quell {
        display: none;
    }
    .cartera-v25 .executive-hero {
        padding-right: 26px;
    }
    .section-title-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .detail-picker select {
        min-width: 0;
        width: 100%;
    }
}


/* ===== V26 Logo original NS Quell ===== */
.global-brand-logo {
    width: 92px;
    background: transparent;
}
.global-brand-logo img {
    background: transparent;
    border-radius: 0;
}
.hero-logo-quell {
    width: 116px;
    background: rgba(255,255,255,.92);
    object-fit: contain;
}
@media (max-width: 900px) {
    .global-brand-logo {
        width: 72px;
    }
}

/* ===== V29 CXC real ===== */
.kpi-card.naranja {
    border-top-color: #f97316;
}
tr.naranja td,
.modal-table tr.naranja td {
    background: rgba(249, 115, 22, .09);
}
.secondary-kpis {
    margin-top: -8px;
}


/* ===== V30 CXC executive clean ===== */
.cxc-exec-page {
    max-width: 1500px;
}
.cxc-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 20px;
    padding: 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 26px 70px rgba(0,63,136,.22);
    overflow: hidden;
}
.cxc-hero h1 {
    margin: 0;
    font-size: clamp(36px, 5vw, 66px);
    line-height: .95;
    letter-spacing: -2px;
}
.cxc-hero .subtitle { max-width: 760px; }
.cxc-main-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 18px 0 14px;
}
.cxc-kpi, .range-card {
    border: 1px solid var(--ns-line);
    border-radius: 24px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 18px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease;
    border-top: 7px solid var(--ns-blue-2);
}
.cxc-kpi:hover, .range-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 26px 65px rgba(0,63,136,.15);
}
.cxc-kpi span, .range-card span {
    display: block;
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.cxc-kpi strong {
    display: block;
    margin: 14px 0 8px;
    color: var(--ns-blue);
    font-size: clamp(26px, 3vw, 42px);
    letter-spacing: -1px;
    line-height: 1;
}
.range-card strong {
    display: block;
    margin-top: 10px;
    color: var(--ns-blue);
    font-size: clamp(20px, 2vw, 28px);
    letter-spacing: -.7px;
}
.cxc-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.cxc-kpi.ok, .range-card.ok { border-top-color: var(--ok); }
.cxc-kpi.danger, .range-card.danger { border-top-color: var(--critico); }
.cxc-kpi.forecast { border-top-color: var(--ns-orange); }
.range-card.info { border-top-color: var(--ns-blue-2); }
.range-card.warning { border-top-color: #ffd400; }
.range-card.orange { border-top-color: #f97316; }
.cxc-range-strip {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.cxc-exec-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(360px, .85fr);
    gap: 18px;
    margin-bottom: 18px;
}
.cxc-panel {
    overflow: hidden;
}
.cxc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.cxc-table th {
    padding: 11px 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    text-align: left;
    font-weight: 950;
    border-bottom: 2px solid #c6dff4;
}
.cxc-table td {
    padding: 10px;
    border-bottom: 1px solid #edf3f8;
}
.cxc-table tr.clickable-row { cursor: pointer; }
.cxc-table tr.clickable-row:hover td { background: #fff8ea; }
.cxc-table tr.ok td, .modal-table tr.ok td { background: #f3fff8; }
.cxc-table tr.info td, .modal-table tr.info td { background: #f2f8ff; }
.cxc-table tr.alerta td, .modal-table tr.alerta td { background: #fffcef; }
.cxc-table tr.naranja td, .modal-table tr.naranja td { background: #fff5ed; }
.cxc-table tr.critico td, .modal-table tr.critico td { background: #fff1f1; }
.status-dot {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-right: 8px;
    border-radius: 999px;
    vertical-align: middle;
    background: var(--ok);
}
.status-dot.info { background: var(--ns-blue-2); }
.status-dot.alerta { background: #ffd400; }
.status-dot.naranja { background: #f97316; }
.status-dot.critico { background: var(--critico); }
.cxc-detail-panel {
    margin-bottom: 24px;
}
.cxc-search, .cxc-select {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 700;
}
.cxc-search { min-width: 260px; }
.cxc-detail-scroll {
    max-height: 520px;
    overflow: auto;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
@media (max-width: 1200px) {
    .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 720px) {
    .cxc-hero, .cxc-main-kpis, .cxc-range-strip, .cxc-exec-grid, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .cxc-search { min-width: 0; width: 100%; }
}


/* ===== V31 Excel projection + expandable client board ===== */
.cartera-excel-page {
    max-width: 1540px;
}
.excel-projection-card {
    background: #fff;
    border-radius: 26px;
    border: 1px solid var(--ns-line);
    box-shadow: 0 22px 65px rgba(0,63,136,.10);
    padding: 20px 20px 24px;
    margin-bottom: 18px;
}
.excel-title-row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 18px;
    align-items: start;
}
.excel-title-row h1 {
    margin: 0;
    color: #000;
    font-size: clamp(28px, 3.6vw, 48px);
    line-height: 1.08;
    letter-spacing: -.8px;
    font-weight: 950;
}
.excel-title-row h1 span {
    display: block;
}
.excel-title-row p {
    margin: 10px 0 0;
    color: #63758a;
    font-weight: 750;
}
.excel-title-row img {
    width: 110px;
    max-width: 18vw;
}
.excel-filters {
    margin: 18px 0 12px;
}
.projection-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin: 8px 0 12px;
}
.projection-total-pill {
    border-radius: 16px;
    border: 1px solid #c6dff4;
    background: #f4f8fc;
    padding: 10px 14px;
}
.projection-total-pill span {
    color: var(--ns-blue);
    font-weight: 950;
    text-transform: uppercase;
    font-size: 11px;
    display: block;
}
.projection-total-pill b {
    color: var(--ns-blue);
    font-size: 24px;
}
.view-toggle {
    display: flex;
    gap: 8px;
    background: #eef6ff;
    border: 1px solid #c6dff4;
    border-radius: 16px;
    padding: 5px;
}
.view-toggle button {
    border: 0;
    background: transparent;
    border-radius: 12px;
    padding: 9px 14px;
    font-weight: 950;
    color: var(--ns-blue);
    cursor: pointer;
}
.view-toggle button.active {
    background: linear-gradient(135deg, var(--ns-orange), var(--ns-orange-2));
    color: #231500;
}
.projection-table-wrap {
    overflow: auto;
    border-radius: 14px;
    border: 1px solid #b9d4ea;
}
.excel-projection-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: 16px;
}
.excel-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff6b00;
    white-space: nowrap;
}
.excel-projection-table td {
    padding: 7px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.excel-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.excel-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.excel-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 650;
    min-width: 360px;
}
.excel-projection-table .num {
    color: #001e5a;
    font-weight: 850;
    text-align: right;
    white-space: nowrap;
}
.excel-projection-table .total-col {
    background: #edf5ff !important;
}
.excel-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    border-radius: 18px;
    border: 1px solid #c6dff4;
    background: #fff;
    padding: 14px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-note {
    margin: 6px 0 0;
    color: #63758a;
    font-weight: 750;
    text-align: right;
}
.cxc-under-projection {
    margin-top: 8px;
}
.cxc-bottom-board {
    margin-top: 18px;
    margin-bottom: 28px;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
@media (max-width: 900px) {
    .excel-title-row,
    .projection-toolbar,
    .invoice-expand-head {
        grid-template-columns: 1fr;
    }
    .projection-toolbar {
        align-items: stretch;
    }
    .view-toggle {
        justify-content: stretch;
    }
    .view-toggle button {
        flex: 1;
    }
}


/* ===== V32 executive projection with clickable amounts ===== */
.cxc-v32-page {
    max-width: 1560px;
}
.v32-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 55%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v32-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v32-hero p {
    margin: 10px 0 0;
    color: #dbefff;
    font-weight: 750;
}
.v32-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v32-filters {
    margin: 16px 0;
}
.v32-kpis {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 16px;
}
.v32-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 16px;
    text-align: left;
    cursor: pointer;
}
.v32-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v32-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v32-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(24px, 2.8vw, 38px);
}
.v32-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v32-projection, .v32-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v32-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v32-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v32-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.projection-table-wrap {
    overflow: auto;
}
.v32-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: collapse;
    font-size: 15px;
}
.v32-projection-table th {
    background: #002b66;
    color: #fff;
    padding: 8px 6px;
    text-align: center;
    font-weight: 950;
    border-bottom: 2px solid #ff8300;
    white-space: nowrap;
}
.v32-projection-table th span,
.v32-projection-table th small {
    display: block;
}
.v32-projection-table td {
    padding: 8px 8px;
    border-bottom: 1px solid #e7f0f8;
}
.v32-projection-table tbody tr:nth-child(odd) td {
    background: #d9edf3;
}
.v32-projection-table tbody tr:nth-child(even) td {
    background: #f8fbfe;
}
.v32-projection-table .client-name {
    color: #0645ff;
    text-decoration: underline;
    font-weight: 750;
    min-width: 330px;
    cursor: pointer;
}
.v32-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.v32-projection-table .total-col {
    background: #edf5ff !important;
}
.v32-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v32-weekly .cxc-table tr {
    cursor: pointer;
}
.client-expand-table .client-main-row {
    cursor: pointer;
}
.client-expand-table .client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.invoice-table th {
    position: sticky;
    top: 0;
    z-index: 1;
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
.client-range-filter {
    height: 34px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 750;
}
@media (max-width: 1200px) {
    .v32-kpis {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 800px) {
    .v32-hero, .v32-kpis, .v32-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v32-section-head {
        display: grid;
    }
    .chart-legend {
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}


/* ===== V33 refinado: limpio, sin tecnicismos, filtros automáticos ===== */
.cxc-v33-page {
    max-width: 1560px;
}
.v33-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v33-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v33-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v33-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v33-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v33-filters {
    margin: 16px 0;
}
.v33-filters button {
    display: none;
}
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v33-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v33-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v33-kpi::after {
    content: "";
    position: absolute;
    inset: auto -20px -35px auto;
    width: 96px;
    height: 96px;
    border-radius: 999px;
    background: rgba(0,63,136,.06);
}
.v33-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v33-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v33-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(22px, 2vw, 31px);
    line-height: 1;
}
.v33-kpi small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v33-kpi.glow-month { border-top-color: var(--ns-orange); box-shadow: 0 18px 45px rgba(255,131,0,.13); }
.v33-kpi.glow-year { border-top-color: var(--ns-blue); }
.v33-kpi.glow-current { border-top-color: var(--ok); }
.v33-kpi.glow-pending { border-top-color: #ffd400; }
.v33-kpi.glow-total { border-top-color: var(--ns-blue-2); }
.v33-kpi.glow-risk { border-top-color: var(--critico); }
.v33-projection, .v33-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v33-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v33-section-head h2 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.v33-section-head p {
    margin: 4px 0 0;
    color: #dbefff;
    font-weight: 700;
}
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button {
    color: #fff;
}
.clean-toggle button.active {
    color: #241400;
}
.v33-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v33-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v33-projection-table th {
    background: #003f88;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v33-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v33-projection-table th b,
.v33-projection-table th span {
    display: block;
}
.v33-projection-table th span {
    color: #dbefff;
    font-size: 11px;
}
.v33-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #e7f0f8;
    border-right: 1px solid #edf3f8;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #f7fbff;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #edf7fb;
}
.v33-projection-table .client-name {
    color: #0047d8;
    font-weight: 850;
    cursor: pointer;
}
.v33-projection-table .client-name:hover {
    text-decoration: underline;
}
.v33-projection-table .num {
    text-align: right;
    white-space: nowrap;
}
.v33-projection-table .total-col {
    background: #e7f2ff !important;
}
.v33-projection-table .totals-row td {
    background: #d8e9fa !important;
    color: #002b66;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #001e5a;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover {
    color: var(--ns-orange);
    text-decoration: underline;
}
.projection-chart-wrap {
    padding: 16px;
}
.projection-chart-wrap canvas {
    width: 100%;
}
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v33-weekly .cxc-table tr {
    cursor: pointer;
}
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
    background: var(--ok);
}
.status-pill.ok { background: var(--ok); }
.status-pill.info { background: var(--ns-blue-2); }
.status-pill.alerta { background: #d9a400; color: #231500; }
.status-pill.naranja { background: #f97316; }
.status-pill.critico { background: var(--critico); }
.client-main-row:hover td {
    background: #fff8ea;
}
.client-detail-row td {
    background: #fff !important;
    padding: 0;
}
.expand-btn {
    width: 28px;
    height: 28px;
    margin-right: 8px;
    border: 0;
    border-radius: 10px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid;
    gap: 4px;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    background: #fff;
    padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue);
    font-weight: 950;
    font-size: 11px;
    text-transform: uppercase;
}
.invoice-expand-head b {
    color: var(--ns-blue);
    font-size: 20px;
}
.invoice-scroll {
    max-height: 360px;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--ns-line);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll {
    max-height: 560px;
    overflow: auto;
}
@media (max-width: 1320px) {
    .v33-kpis { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 880px) {
    .v33-hero, .v33-section-head, .invoice-expand-head, .cxc-modal-summary {
        grid-template-columns: 1fr;
    }
    .v33-section-head { display: grid; }
    .v33-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V34 semaforo limpio y cuadro azul ===== */
.v33-projection-table th {
    background: #0b4f9c !important;
    color: #ffffff !important;
}
.v33-projection-table td {
    background: #d9ecff !important;
    color: #000000 !important;
}
.v33-projection-table tbody tr:nth-child(odd) td {
    background: #cfe7fb !important;
}
.v33-projection-table tbody tr:nth-child(even) td {
    background: #e8f4ff !important;
}
.v33-projection-table .client-name {
    color: #000000 !important;
    text-decoration: none !important;
}
.v33-projection-table .client-name:hover {
    text-decoration: none !important;
    color: #003f88 !important;
}
.amount-link {
    color: #000000 !important;
    text-decoration: none !important;
}
.amount-link:hover {
    color: #003f88 !important;
    text-decoration: none !important;
}
.v33-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000000 !important;
}
.status-pill.warning {
    background: #ff8300;
    color: #000000;
}
.status-pill.alerta {
    background: #ffd400;
    color: #000000;
}
.status-pill.critico {
    background: #e32626;
    color: #ffffff;
}
.status-pill.ok {
    background: #00a651;
    color: #ffffff;
}


/* ===== V35 estado correcto en al corriente y tarjetas consistentes ===== */
.status-pill.ok {
    background: #00a651 !important;
    color: #ffffff !important;
}
.status-pill.warning {
    background: #ff8300 !important;
    color: #000000 !important;
}
.status-pill.critico {
    background: #e32626 !important;
    color: #ffffff !important;
}
.status-pill.alerta {
    background: #ffd400 !important;
    color: #000000 !important;
}


/* ===== V36 tarjetas con graficas y cuadro limpio ===== */
.cxc-v36-page { max-width: 1560px; }
.v36-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 18px;
    padding: 24px 28px;
    border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v36-hero p {
    margin: 0 0 6px;
    color: #ffe1b8;
    font-size: 12px;
    letter-spacing: .14em;
    font-weight: 950;
    text-transform: uppercase;
}
.v36-hero h1 {
    margin: 0;
    font-size: clamp(34px, 5vw, 62px);
    line-height: 1;
    letter-spacing: -1.5px;
}
.v36-hero span {
    display: block;
    margin-top: 10px;
    color: #dbefff;
    font-weight: 750;
}
.v36-hero img {
    width: 108px;
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    padding: 10px;
}
.v36-filters { margin: 16px 0; }
.v36-filters button { display: none; }
.auto-filter-note {
    align-self: center;
    color: var(--ns-muted);
    font-weight: 800;
}
.v36-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.v36-kpi {
    border: 1px solid var(--ns-line);
    border-top: 7px solid var(--ns-blue-2);
    border-radius: 22px;
    background: rgba(255,255,255,.97);
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: left;
    cursor: pointer;
    min-height: 136px;
    position: relative;
    overflow: hidden;
}
.v36-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 25px 65px rgba(0,63,136,.14);
}
.v36-kpi span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v36-kpi strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px, 2vw, 30px);
    line-height: 1;
}
.v36-kpi small { color: var(--ns-muted); font-weight: 750; }
.v36-kpi.month { border-top-color: var(--ns-orange); }
.v36-kpi.year { border-top-color: var(--ns-blue); }
.v36-kpi.current { border-top-color: var(--ok); }
.v36-kpi.pending { border-top-color: #ff8300; }
.v36-kpi.total { border-top-color: var(--ns-blue-2); }
.v36-kpi.risk { border-top-color: var(--critico); }
.v36-projection, .v36-weekly, .cxc-bottom-board {
    background: #fff;
    border: 1px solid var(--ns-line);
    border-radius: 26px;
    box-shadow: 0 20px 60px rgba(0,63,136,.08);
    overflow: hidden;
    margin-bottom: 18px;
}
.v36-section-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    background: linear-gradient(90deg, #061b39, var(--ns-blue));
    color: #fff;
}
.v36-section-head h2 { margin: 0; text-transform: uppercase; letter-spacing: .06em; }
.v36-section-head p { margin: 4px 0 0; color: #dbefff; font-weight: 700; }
.clean-toggle {
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.28);
}
.clean-toggle button { color: #fff; }
.clean-toggle button.active { color: #241400; }
.v36-table-wrap {
    overflow: auto;
    padding: 12px;
    background: #f5f9fd;
}
.v36-projection-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px;
    background: #fff;
    border: 1px solid #c6dff4;
    border-radius: 18px;
    overflow: hidden;
}
.v36-projection-table th {
    background: #0b4f9c;
    color: #fff;
    padding: 11px 8px;
    text-align: center;
    font-weight: 950;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.v36-projection-table th.client-head {
    text-align: left;
    min-width: 330px;
}
.v36-projection-table th b, .v36-projection-table th span { display: block; }
.v36-projection-table th span { color: #dbefff; font-size: 11px; }
.v36-projection-table td {
    padding: 9px 9px;
    border-bottom: 1px solid #d0dfec;
    border-right: 1px solid #d0dfec;
    color: #000;
}
.v36-projection-table tbody tr:nth-child(odd) td { background: #cfe7fb; }
.v36-projection-table tbody tr:nth-child(even) td { background: #e8f4ff; }
.v36-projection-table .client-name { color: #000; font-weight: 850; cursor: pointer; text-decoration: none; }
.v36-projection-table .client-name:hover { color: #003f88; }
.v36-projection-table .num { text-align: right; white-space: nowrap; }
.v36-projection-table .total-col { background: #d6eafa !important; }
.v36-projection-table .totals-row td {
    background: #b8d7f4 !important;
    color: #000;
    font-weight: 950;
    border-top: 2px solid #2a7aa8;
}
.amount-link {
    border: 0;
    background: transparent;
    color: #000;
    font-weight: 950;
    text-align: right;
    cursor: pointer;
    text-decoration: none;
}
.amount-link:hover { color: #003f88; text-decoration: none; }
.projection-chart-wrap, .modal-chart-wrap { padding: 16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width: 100%; }
.chart-legend {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    color: #63758a;
    font-weight: 750;
    margin-top: 6px;
}
.modal-legend { justify-content: flex-start; }
.legend-bar, .legend-line, .legend-trend {
    display: inline-block;
    width: 20px;
    height: 5px;
    border-radius: 999px;
    margin-right: 4px;
    vertical-align: middle;
}
.legend-bar { background: var(--ns-blue); }
.legend-line { background: var(--ok); }
.legend-trend { background: var(--critico); }
.v36-weekly .cxc-table tr { cursor: pointer; }
.status-pill {
    display: inline-block;
    min-width: 78px;
    text-align: center;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 950;
    color: #fff;
}
.status-pill.ok { background: #00a651 !important; color: #fff !important; }
.status-pill.warning { background: #ff8300 !important; color: #000 !important; }
.status-pill.critico { background: #e32626 !important; color: #fff !important; }
.client-main-row:hover td { background: #fff8ea; }
.client-detail-row td { background: #fff !important; padding: 0; }
.expand-btn {
    width: 28px; height: 28px; margin-right: 8px; border: 0; border-radius: 10px;
    background: #e8f4ff; color: var(--ns-blue); font-weight: 950; cursor: pointer;
}
.client-invoices-container {
    padding: 14px;
    border-left: 6px solid var(--ns-orange);
    background: #fbfdff;
}
.invoice-expand-head {
    display: grid;
    grid-template-columns: repeat(2, minmax(160px, 240px)) minmax(220px, 320px);
    gap: 12px;
    align-items: end;
    margin-bottom: 12px;
}
.invoice-expand-head div, .invoice-expand-head label {
    display: grid; gap: 4px; border: 1px solid var(--ns-line); border-radius: 16px; background: #fff; padding: 10px;
}
.invoice-expand-head span {
    color: var(--ns-blue); font-weight: 950; font-size: 11px; text-transform: uppercase;
}
.invoice-expand-head b { color: var(--ns-blue); font-size: 20px; }
.invoice-scroll { max-height: 360px; overflow: auto; border-radius: 16px; border: 1px solid var(--ns-line); }
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px; background: #f4f8fc; border: 1px solid var(--ns-line); padding: 12px;
}
.cxc-modal-summary span {
    display: block; color: var(--ns-muted); font-size: 11px; font-weight: 950; text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block; margin-top: 6px; color: var(--ns-blue); font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
@media (max-width: 1320px) { .v36-kpis { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 880px) {
    .v36-hero, .v36-section-head, .invoice-expand-head, .cxc-modal-summary { grid-template-columns: 1fr; }
    .v36-section-head { display: grid; }
    .v36-kpis { grid-template-columns: 1fr; }
    .chart-legend { justify-content: flex-start; flex-wrap: wrap; }
}


/* ===== V37 graficas 3D y matrix board ===== */
.cxc-v37-page { max-width: 1560px; }
.v37-hero {
    display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px;
    padding: 24px 28px; border-radius: 28px;
    background: linear-gradient(135deg, #061b39, var(--ns-blue) 58%, var(--ns-orange));
    color: #fff; box-shadow: 0 24px 70px rgba(0,63,136,.20);
}
.v37-hero p { margin: 0 0 6px; color: #ffe1b8; font-size: 12px; letter-spacing: .14em; font-weight: 950; text-transform: uppercase; }
.v37-hero h1 { margin: 0; font-size: clamp(34px, 5vw, 62px); line-height: 1; letter-spacing: -1.5px; }
.v37-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v37-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v37-filters { margin: 16px 0; }
.v37-filters button { display: none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v37-kpis {
    display:grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px;
}
.v37-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:hidden;
}
.v37-kpi:hover { transform:translateY(-2px); box-shadow:0 25px 65px rgba(0,63,136,.14); }
.v37-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v37-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v37-kpi small { color:var(--ns-muted); font-weight:750; }
.v37-kpi.month { border-top-color:var(--ns-orange); } .v37-kpi.year { border-top-color:var(--ns-blue); }
.v37-kpi.current { border-top-color:var(--ok); } .v37-kpi.pending { border-top-color:#ff8300; }
.v37-kpi.total { border-top-color:var(--ns-blue-2); } .v37-kpi.risk { border-top-color:var(--critico); }
.v37-projection, .v37-weekly, .cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:hidden; margin-bottom:18px;
}
.v37-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff;
}
.v37-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v37-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v37-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v37-board-table {
    width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px;
}
.v37-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v37-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v37-board-table th:last-child { border-radius:0 16px 16px 0; }
.v37-board-table th b, .v37-board-table th span { display:block; }
.v37-board-table th span { color:#dbefff; font-size:11px; }
.v37-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v37-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v37-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v37-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v37-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v37-board-table .num { text-align:right; white-space:nowrap; }
.v37-board-table .total-col { background:#d7ebff!important; }
.v37-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link { border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none; }
.amount-link:hover { color:#003f88; text-decoration:none; }
.projection-chart-wrap, .modal-chart-wrap { padding:16px; }
.projection-chart-wrap canvas, .modal-chart-wrap canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar, .legend-line, .legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:repeat(2,minmax(160px,240px)) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div, .invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v37-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v37-hero,.v37-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v37-section-head{display:grid;} .v37-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V39 clean labels, client charts, hover overlay ===== */
.cxc-v39-page { max-width: 1560px; }
.v39-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v39-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v39-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v39-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v39-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v39-filters { margin:16px 0; }
.v39-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v39-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v39-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:rgba(255,255,255,.97); box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px;
    text-align:left; cursor:pointer; min-height:136px; position:relative; overflow:visible;
    transition:transform .16s ease, box-shadow .16s ease, z-index .16s ease;
}
.v39-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015);
    box-shadow:0 24px 70px rgba(0,63,136,.18);
    z-index:8;
}
.v39-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v39-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v39-kpi small { color:var(--ns-muted); font-weight:750; }
.v39-kpi.month { border-top-color:var(--ns-orange); } .v39-kpi.year { border-top-color:var(--ns-blue); }
.v39-kpi.current { border-top-color:var(--ok); } .v39-kpi.pending { border-top-color:#ff8300; }
.v39-kpi.total { border-top-color:var(--ns-blue-2); } .v39-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
    box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.v39-projection,.v39-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v39-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v39-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v39-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn {
    height:40px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 14px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; justify-content:flex-end;
}
.chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select { height:40px; min-width:250px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v39-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v39-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v39-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950;
    border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v39-board-table th:first-child { border-radius:16px 0 0 16px; text-align:left; min-width:330px; }
.v39-board-table th:last-child { border-radius:0 16px 16px 0; }
.v39-board-table th b,.v39-board-table th span { display:block; }
.v39-board-table th span { color:#dbefff; font-size:11px; }
.v39-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0;
}
.v39-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; }
.v39-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v39-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v39-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v39-board-table .num { text-align:right; white-space:nowrap; }
.v39-board-table .total-col { background:#d7ebff!important; }
.v39-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:right; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 6px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.7); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; }
.status-pill.warning { background:#ff8300!important; color:#000!important; }
.status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v39-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v39-hero,.v39-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v39-section-head{display:grid;} .v39-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V40 fixes: centered, contrast, chart filters, exports ===== */
.cxc-v40-page { max-width: 1560px; }
.v40-filters { margin: 16px 0; }
.v40-filters button { display: none; }
.v40-kpi, .hover-rise, .amount-link { transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.v40-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.mini-btn {
    height: 34px;
    border: 1px solid #c8d7e6;
    border-radius: 12px;
    padding: 0 12px;
    background: #e8f4ff;
    color: var(--ns-blue);
    font-weight: 950;
    cursor: pointer;
}
.modal-chart-controls, .chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border-bottom: 1px solid var(--ns-line);
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.modal-chart-controls label, .chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select, .chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.cxc-table th,
.cxc-table td {
    text-align: center;
    vertical-align: middle;
}
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: center;
}
.v40-board-table td,
.v40-board-table th,
.v39-board-table td,
.v39-board-table th {
    text-align: center !important;
    vertical-align: middle;
}
.v40-board-table th,
.v39-board-table th,
.section-title {
    letter-spacing: .04em;
    font-weight: 950;
}
.amount-link {
    border-radius: 10px;
    padding: 4px 8px;
}
.amount-link:hover {
    background: rgba(255,255,255,.75);
    text-decoration: none !important;
}
.projection-chart-wrap,
.modal-chart-wrap,
.client-chart-box {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100%;
}
.cxc-modal-summary {
    grid-template-columns: repeat(3, 1fr) !important;
}
.cxc-modal-summary div {
    text-align: center;
}
.invoice-expand-head {
    grid-template-columns: minmax(160px,240px) minmax(220px,320px) !important;
}
.client-main-row:hover td {
    background: #fff8ea !important;
    position: relative;
    z-index: 5;
    box-shadow: 0 14px 35px rgba(0,63,136,.12);
}
[data-hint] { position: relative; }
[data-hint]:hover::after {
    content: attr(data-hint);
    position: absolute;
    right: 10px;
    top: -32px;
    background: #05182e;
    color: #fff;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
    z-index: 20;
    box-shadow: 0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 900px) {
    .modal-chart-controls, .chart-controls { justify-content: stretch; }
    .modal-chart-controls label, .chart-controls label { width: 100%; }
    .modal-chart-controls select, .chart-controls select { width: 100%; }
}


/* ===== V41 final fix: working charts, left first columns ===== */
.cxc-v41-page { max-width: 1560px; }
.v41-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v41-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v41-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v41-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v41-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v41-filters { margin:16px 0; }
.v41-filters button { display:none; }
.auto-filter-note { align-self:center; color:var(--ns-muted); font-weight:800; }
.v41-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v41-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v41-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v41-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v41-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v41-kpi small { color:var(--ns-muted); font-weight:750; }
.v41-kpi.month { border-top-color:var(--ns-orange); } .v41-kpi.year { border-top-color:var(--ns-blue); }
.v41-kpi.current { border-top-color:var(--ok); } .v41-kpi.pending { border-top-color:#ff8300; }
.v41-kpi.total { border-top-color:var(--ns-blue-2); } .v41-kpi.risk { border-top-color:var(--critico); }
[data-hint] { position:relative; }
[data-hint]:hover::after {
    content:attr(data-hint); position:absolute; right:10px; top:-32px; background:#05182e; color:#fff;
    padding:6px 10px; border-radius:10px; font-size:12px; font-weight:800; white-space:nowrap; z-index:20;
}
.v41-projection,.v41-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v41-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v41-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v41-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.projection-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.special-graph-btn,.mini-btn {
    height:38px; border:1px solid rgba(255,255,255,.35); border-radius:14px; padding:0 13px;
    background:linear-gradient(135deg,var(--ns-orange),var(--ns-orange-2)); color:#241400; font-weight:950; cursor:pointer;
}
.mini-btn { height:34px; background:#e8f4ff; border:1px solid #c8d7e6; color:var(--ns-blue); }
.clean-toggle { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.28); }
.clean-toggle button { color:#fff; } .clean-toggle button.active { color:#241400; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.v41-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v41-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v41-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v41-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v41-board-table th:last-child { border-radius:0 16px 16px 0; }
.v41-board-table th b,.v41-board-table th span { display:block; }
.v41-board-table th span { color:#dbefff; font-size:11px; }
.v41-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v41-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v41-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v41-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v41-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v41-board-table .num { text-align:center; white-space:nowrap; }
.v41-board-table .total-col { background:#d7ebff!important; }
.v41-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.amount-link {
    border:0; background:transparent; color:#000; font-weight:950; text-align:center; cursor:pointer; text-decoration:none;
    border-radius:10px; padding:4px 8px; transition:transform .16s ease, background .16s ease;
}
.amount-link:hover { color:#003f88; text-decoration:none; background:rgba(255,255,255,.75); }
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box { padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden; }
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.chart-legend { display:flex; justify-content:flex-end; gap:16px; color:#63758a; font-weight:750; margin-top:6px; }
.legend-bar,.legend-line,.legend-trend { display:inline-block; width:20px; height:5px; border-radius:999px; margin-right:4px; vertical-align:middle; }
.legend-bar { background:var(--ns-blue); } .legend-line { background:var(--ok); } .legend-trend { background:var(--critico); }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.expand-btn { width:28px; height:28px; margin-right:8px; border:0; border-radius:10px; background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer; }
.client-invoices-container { padding:14px; border-left:6px solid var(--ns-orange); background:#fbfdff; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
.invoice-expand-head div,.invoice-expand-head label { display:grid; gap:4px; border:1px solid var(--ns-line); border-radius:16px; background:#fff; padding:10px; }
.invoice-expand-head span { color:var(--ns-blue); font-weight:950; font-size:11px; text-transform:uppercase; }
.invoice-expand-head b { color:var(--ns-blue); font-size:20px; }
.invoice-scroll { max-height:360px; overflow:auto; border-radius:16px; border:1px solid var(--ns-line); }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.cxc-detail-scroll { max-height:560px; overflow:auto; }
@media (max-width:1320px){ .v41-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v41-hero,.v41-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v41-section-head{display:grid;} .v41-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}


/* ===== V42: external JS, working modals/charts, left first columns ===== */
.cxc-v48-page { max-width: 1560px; }
.v48-hero {
    display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px;
    padding:24px 28px; border-radius:28px; background:linear-gradient(135deg,#061b39,var(--ns-blue) 58%,var(--ns-orange));
    color:#fff; box-shadow:0 24px 70px rgba(0,63,136,.20);
}
.v48-hero p { margin:0 0 6px; color:#ffe1b8; font-size:12px; letter-spacing:.14em; font-weight:950; text-transform:uppercase; }
.v48-hero h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1; letter-spacing:-1.5px; }
.v48-hero span { display:block; margin-top:10px; color:#dbefff; font-weight:750; }
.v48-hero img { width:108px; border-radius:20px; background:rgba(255,255,255,.96); padding:10px; }
.v48-filters { margin:16px 0; }
.v48-filters button { display:none; }
.v48-kpis { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.v48-kpi {
    border:1px solid var(--ns-line); border-top:7px solid var(--ns-blue-2); border-radius:22px;
    background:#fff; box-shadow:0 18px 45px rgba(0,63,136,.08); padding:14px; text-align:center; cursor:pointer;
    min-height:136px; position:relative; overflow:visible; transition:transform .16s ease, box-shadow .16s ease;
}
.v48-kpi:hover, .hover-rise:hover, .amount-link:hover {
    transform:translateY(-4px) scale(1.015); box-shadow:0 24px 70px rgba(0,63,136,.18); z-index:8;
}
.v48-kpi span { display:block; color:var(--ns-blue); text-transform:uppercase; font-size:10px; letter-spacing:.05em; font-weight:950; }
.v48-kpi strong { display:block; margin:10px 0 6px; color:var(--ns-blue); font-size:clamp(21px,2vw,30px); line-height:1; }
.v48-kpi small { color:var(--ns-muted); font-weight:750; }
.v48-kpi.month { border-top-color:var(--ns-orange); } .v48-kpi.year { border-top-color:var(--ns-blue); }
.v48-kpi.current { border-top-color:var(--ok); } .v48-kpi.pending { border-top-color:#ff8300; }
.v48-kpi.total { border-top-color:var(--ns-blue-2); } .v48-kpi.risk { border-top-color:var(--critico); }
.v48-projection,.v48-weekly,.cxc-bottom-board {
    background:#fff; border:1px solid var(--ns-line); border-radius:26px; box-shadow:0 20px 60px rgba(0,63,136,.08);
    overflow:visible; margin-bottom:18px;
}
.v48-section-head {
    display:flex; justify-content:space-between; align-items:center; gap:16px; padding:16px 18px;
    background:linear-gradient(90deg,#061b39,var(--ns-blue)); color:#fff; border-radius:26px 26px 0 0;
}
.v48-section-head h2 { margin:0; text-transform:uppercase; letter-spacing:.06em; }
.v48-section-head p { margin:4px 0 0; color:#dbefff; font-weight:700; }
.v48-board-wrap { overflow:auto; padding:14px; background:linear-gradient(180deg,#f5f9fd,#edf6ff); }
.v48-board-table { width:100%; min-width:980px; border-collapse:separate; border-spacing:0 8px; font-size:14px; }
.v48-board-table th {
    background:#0b4f9c; color:#fff; padding:12px 10px; text-align:center; font-weight:950; border-right:1px solid rgba(255,255,255,.18); white-space:nowrap;
}
.v48-board-table th:first-child { border-radius:16px 0 0 16px; min-width:330px; text-align:left; }
.v48-board-table th:last-child { border-radius:0 16px 16px 0; }
.v48-board-table th b,.v48-board-table th span { display:block; }
.v48-board-table th span { color:#dbefff; font-size:11px; }
.v48-board-table td {
    padding:12px 10px; background:#e5f3ff; color:#000; border-top:1px solid #c9ddf0; border-bottom:1px solid #c9ddf0; text-align:center;
}
.v48-board-table tr td:first-child { border-left:1px solid #c9ddf0; border-radius:16px 0 0 16px; text-align:left; }
.v48-board-table tr td:last-child { border-right:1px solid #c9ddf0; border-radius:0 16px 16px 0; }
.v48-board-table tbody tr:nth-child(even) td { background:#f5fbff; }
.v48-board-table .client-name { color:#000; font-weight:900; cursor:pointer; text-decoration:none; }
.v48-board-table .num { text-align:center; white-space:nowrap; }
.v48-board-table .total-col { background:#d7ebff!important; }
.v48-board-table .totals-row td { background:#b8d7f4!important; color:#000; font-weight:950; border-top:2px solid #2a7aa8; }
.chart-controls,.modal-chart-controls {
    padding:12px 16px; background:#f4f8fc; border-bottom:1px solid var(--ns-line); display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap;
}
.chart-controls label,.modal-chart-controls label { display:grid; gap:4px; color:var(--ns-blue); font-size:11px; text-transform:uppercase; font-weight:950; }
.chart-controls select,.modal-chart-controls select { height:40px; min-width:210px; border-radius:12px; border:1px solid #c8d7e6; padding:0 10px; font-weight:800; }
.mini-btn {
    height:34px; border:1px solid #c8d7e6; border-radius:12px; padding:0 12px;
    background:#e8f4ff; color:var(--ns-blue); font-weight:950; cursor:pointer;
}
.projection-chart-wrap,.modal-chart-wrap,.client-chart-box {
    padding:16px; background:#fff; border-radius:18px; border:1px solid var(--ns-line); margin-bottom:12px; overflow:hidden;
}
.projection-chart-wrap canvas,.modal-chart-wrap canvas,.client-chart-box canvas { width:100%; }
.cxc-table th,.cxc-table td { text-align:center; vertical-align:middle; }
.cxc-table th:first-child,.cxc-table td:first-child { text-align:left; }
.cxc-modal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; }
.cxc-modal-summary div { border-radius:18px; background:#f4f8fc; border:1px solid var(--ns-line); padding:12px; text-align:center; }
.cxc-modal-summary span { display:block; color:var(--ns-muted); font-size:11px; font-weight:950; text-transform:uppercase; }
.cxc-modal-summary b { display:block; margin-top:6px; color:var(--ns-blue); font-size:22px; }
.status-pill { display:inline-block; min-width:78px; text-align:center; border-radius:999px; padding:5px 10px; font-size:11px; font-weight:950; color:#fff; }
.status-pill.ok { background:#00a651!important; } .status-pill.warning { background:#ff8300!important; color:#000!important; } .status-pill.critico { background:#e32626!important; }
.client-main-row:hover td { background:#fff8ea; position:relative; z-index:5; box-shadow:0 14px 35px rgba(0,63,136,.12); }
.client-detail-row td { background:#fff!important; padding:0; }
.invoice-expand-head { display:grid; grid-template-columns:minmax(160px,240px) minmax(220px,320px); gap:12px; align-items:end; margin-bottom:12px; }
@media (max-width:1320px){ .v48-kpis{grid-template-columns:repeat(3,1fr);} }
@media (max-width:880px){
    .v48-hero,.v48-section-head,.invoice-expand-head,.cxc-modal-summary{grid-template-columns:1fr;}
    .v48-section-head{display:grid;} .v48-kpis{grid-template-columns:1fr;} .chart-legend{justify-content:flex-start; flex-wrap:wrap;}
}

/* keep first columns aligned left */
.v48-board-table th:first-child,.v48-board-table tr td:first-child,.cxc-table th:first-child,.cxc-table td:first-child{text-align:left!important;}


/* ===== V44 stable: mini charts and restored client board ===== */
.kpi-mini-chart {
    width: 100%;
    height: 48px;
    display: block;
    margin-top: 10px;
}
.v48-kpi {
    overflow: hidden;
    min-height: 188px;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child),
.cxc-table th:not(:first-child),
.cxc-table td:not(:first-child) {
    text-align: center;
}
.projection-chart-wrap canvas,
.modal-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    min-height: 220px;
}
.modal-chart-controls,
.chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
}


/* ===== V45: chart only in modal, weekly accumulated bars ===== */
.v48-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}
.modal-chart-controls {
    display: flex !important;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.modal-chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}


/* ===== V46: single script, modals only for card charts ===== */
.v48-kpi {
    min-height: 136px !important;
    overflow: visible !important;
}
.kpi-mini-chart {
    display: none !important;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}


/* ===== V47: aging cards 30/60/90/120 above cartera por cliente ===== */
.v48-aging-cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 18px;
}
.v48-aging-card {
    border: 1px solid var(--ns-line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: center;
    cursor: pointer;
    min-height: 128px;
    position: relative;
    border-top: 7px solid var(--ns-blue-2);
    transition: transform .16s ease, box-shadow .16s ease;
}
.v48-aging-card:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.v48-aging-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v48-aging-card strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px,2vw,30px);
    line-height: 1;
}
.v48-aging-card small {
    color: var(--ns-muted);
    font-weight: 750;
}
.v48-aging-card.d30 { border-top-color: #00a651; }
.v48-aging-card.d60 { border-top-color: #ffbf00; }
.v48-aging-card.d90 { border-top-color: #ff8300; }
.v48-aging-card.d120 { border-top-color: #e32626; }
@media (max-width: 1000px) {
    .v48-aging-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
    .v48-aging-cards { grid-template-columns: 1fr; }
}


/* ===== V48 impact layer: same design, stronger interactions ===== */
body.ns-working::after {
    content: "Actualizando información...";
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 9999;
    background: #05182e;
    color: #fff;
    padding: 10px 14px;
    border-radius: 14px;
    box-shadow: 0 18px 44px rgba(0,0,0,.22);
    font-weight: 850;
    letter-spacing: .02em;
}
.ns-toast {
    position: fixed;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%) translateY(20px);
    opacity: 0;
    pointer-events: none;
    z-index: 9999;
    background: #05182e;
    color: #fff;
    border-radius: 14px;
    padding: 10px 14px;
    box-shadow: 0 18px 44px rgba(0,0,0,.25);
    font-weight: 850;
    transition: opacity .18s ease, transform .18s ease;
}
.ns-toast.show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}
.modal-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0 0 12px;
    padding: 10px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
}
.modal-actions span {
    color: var(--ns-muted);
    font-size: 12px;
    font-weight: 800;
}
.mini-btn.ghost {
    background: #fff !important;
    color: var(--ns-blue) !important;
}
.v48-kpi, .v48-aging-card, .clickable-row, .amount-link, [data-info], [data-provider], [data-provider-all] {
    will-change: transform;
}
.v48-kpi:focus-visible, .v48-aging-card:focus-visible, .amount-link:focus-visible, .mini-btn:focus-visible {
    outline: 3px solid rgba(255,131,0,.45);
    outline-offset: 3px;
}
.v48-board-table th:first-child,
.v48-board-table tr td:first-child,
.cxc-table th:first-child,
.cxc-table td:first-child {
    text-align: left !important;
}
.v48-board-table th:not(:first-child),
.v48-board-table td:not(:first-child) {
    text-align: center !important;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    width: 100% !important;
    display: block;
}
.kpi-mini-chart { display: none !important; }
.v48-aging-cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 18px;
}
.v48-aging-card {
    border: 1px solid var(--ns-line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(0,63,136,.08);
    padding: 14px;
    text-align: center;
    cursor: pointer;
    min-height: 128px;
    position: relative;
    border-top: 7px solid var(--ns-blue-2);
    transition: transform .16s ease, box-shadow .16s ease;
}
.v48-aging-card:hover {
    transform: translateY(-4px) scale(1.015);
    box-shadow: 0 24px 70px rgba(0,63,136,.18);
    z-index: 8;
}
.v48-aging-card span {
    display: block;
    color: var(--ns-blue);
    text-transform: uppercase;
    font-size: 10px;
    letter-spacing: .05em;
    font-weight: 950;
}
.v48-aging-card strong {
    display: block;
    margin: 10px 0 6px;
    color: var(--ns-blue);
    font-size: clamp(21px,2vw,30px);
    line-height: 1;
}
.v48-aging-card small { color: var(--ns-muted); font-weight: 750; }
.v48-aging-card.d30 { border-top-color: #00a651; }
.v48-aging-card.d60 { border-top-color: #ffbf00; }
.v48-aging-card.d90 { border-top-color: #ff8300; }
.v48-aging-card.d120 { border-top-color: #e32626; }
@media (max-width: 1000px) { .v48-aging-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .v48-aging-cards { grid-template-columns: 1fr; } }


/* ===== V49 Facturacion premium modals/charts/export ===== */
.modal-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0 0 12px;
    padding: 10px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
}
.modal-actions span {
    color: var(--ns-muted);
    font-size: 12px;
    font-weight: 800;
}
.mini-btn.ghost {
    background: #fff !important;
    color: var(--ns-blue) !important;
}
.modal-chart-controls {
    padding: 12px 16px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    border-radius: 16px;
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.modal-chart-controls label {
    display: grid;
    gap: 4px;
    color: var(--ns-blue);
    font-size: 11px;
    text-transform: uppercase;
    font-weight: 950;
}
.modal-chart-controls select {
    height: 40px;
    min-width: 210px;
    border-radius: 12px;
    border: 1px solid #c8d7e6;
    padding: 0 10px;
    font-weight: 800;
}
.modal-chart-wrap {
    padding: 16px;
    background: #fff;
    border-radius: 18px;
    border: 1px solid var(--ns-line);
    margin-bottom: 12px;
    overflow: hidden;
}
.modal-chart-wrap canvas {
    width: 100% !important;
    display: block;
}
.ns-toast {
    position: fixed;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%) translateY(20px);
    opacity: 0;
    pointer-events: none;
    z-index: 9999;
    background: #05182e;
    color: #fff;
    border-radius: 14px;
    padding: 10px 14px;
    box-shadow: 0 18px 44px rgba(0,0,0,.25);
    font-weight: 850;
    transition: opacity .18s ease, transform .18s ease;
}
.ns-toast.show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}
.cxc-modal-summary {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 12px;
    margin-bottom: 14px;
}
.cxc-modal-summary div {
    border-radius: 18px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    padding: 12px;
    text-align: center;
}
.cxc-modal-summary span {
    display: block;
    color: var(--ns-muted);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
}
.cxc-modal-summary b {
    display: block;
    margin-top: 6px;
    color: var(--ns-blue);
    font-size: 22px;
}
.cxc-detail-scroll { max-height: 560px; overflow: auto; }
.modal-table th:first-child,
.modal-table td:first-child { text-align: left !important; }


/* ===== V50 ejecutivo responsivo, marca de agua y reglas de fecha ===== */
body::before {
    content: "";
    position: fixed;
    right: 22px;
    top: 82px;
    width: 230px;
    height: 230px;
    background: url('/img/ns-quell-logo-original.png') center / contain no-repeat;
    opacity: .065;
    z-index: 0;
    pointer-events: none;
    filter: drop-shadow(0 18px 38px rgba(0,63,136,.18));
}
.page-shell {
    position: relative;
    z-index: 1;
}
.hero h1 {
    text-shadow: 0 8px 28px rgba(0,0,0,.28);
    letter-spacing: -1.6px;
}
.section-title,
.v48-section-head h2,
.v48-hero h1,
.hero h1 {
    font-weight: 1000;
}
.section-title {
    font-size: 15px;
    letter-spacing: .09em;
}
.filters.auto-filters button[type="submit"],
.filters.compact-filters button[type="submit"] {
    display: none !important;
}
.week-chip.future {
    opacity: .78;
    border-color: #ffd400 !important;
    background: linear-gradient(135deg, #fffdf0, #f7fbff);
}
.week-chip.future strong {
    color: #8a6500;
}
.future-row td {
    background: #fff9dd !important;
    color: #8a6500 !important;
}
.future-row .pill {
    background: #fff1a8 !important;
    color: #5d4300 !important;
}
.metric-card.alerta:before,
.hero-total.alerta,
.hero-badge.alerta {
    background-color: #ffbf00;
}
.metric-card.critico.in-progress:before {
    background: #ffbf00;
}
.client-document-groups {
    display: grid;
    gap: 12px;
    margin-bottom: 18px;
}
.client-doc-detail {
    border: 1px solid var(--ns-line);
    border-radius: 18px;
    background: rgba(255,255,255,.92);
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,63,136,.06);
}
.client-doc-detail summary {
    list-style: none;
    cursor: pointer;
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    color: var(--ns-blue);
    font-weight: 950;
}
.client-doc-detail summary::-webkit-details-marker {
    display: none;
}
.client-doc-detail summary:before {
    content: "+";
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 10px;
    background: #e8f4ff;
    margin-right: 8px;
}
.client-doc-detail[open] summary:before {
    content: "−";
}
.client-doc-detail summary b {
    display: flex;
    align-items: center;
}
.client-doc-detail summary span {
    color: var(--ns-blue);
}
.client-doc-detail summary i {
    font-style: normal;
    color: var(--ns-muted);
    font-size: 12px;
}
.compact-detail {
    margin: 0;
    border-top: 1px solid var(--ns-line);
}
.pretty-table td:first-child,
.pretty-table th:first-child,
.acumulado-table td:first-child,
.acumulado-table th:first-child {
    text-align: left !important;
}
.pretty-table td:not(:first-child),
.pretty-table th:not(:first-child),
.acumulado-table td:not(:first-child),
.acumulado-table th:not(:first-child) {
    text-align: center;
}
.metric-card,
.week-chip,
.pretty-table tbody tr,
.acumulado-table td,
.indicator-row,
.month-total-card,
.total-mini {
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.metric-card:hover,
.week-chip:hover,
.pretty-table tbody tr:hover,
.acumulado-table td:hover,
.indicator-row:hover,
.month-total-card:hover,
.total-mini:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 45px rgba(0,63,136,.12);
    position: relative;
    z-index: 3;
}
body.ns-working::after {
    content: "Actualizando información...";
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 9999;
    background: #05182e;
    color: #fff;
    padding: 10px 14px;
    border-radius: 14px;
    box-shadow: 0 18px 44px rgba(0,0,0,.22);
    font-weight: 850;
}
@media (max-width: 1280px) {
    .cards-grid,
    .v48-kpis,
    .v48-aging-cards {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
    .dashboard-grid,
    .no-week-column {
        grid-template-columns: 1fr !important;
    }
}
@media (max-width: 900px) {
    body::before {
        width: 150px;
        height: 150px;
        top: 74px;
        right: 6px;
        opacity: .045;
    }
    .page-shell {
        padding: 12px;
    }
    .top-nav-tabs {
        overflow-x: auto;
        display: flex;
        gap: 8px;
        padding-bottom: 4px;
    }
    .top-nav-tabs a {
        white-space: nowrap;
        flex: 0 0 auto;
    }
    .hero,
    .compact-hero,
    .v48-hero {
        display: grid !important;
        grid-template-columns: 1fr !important;
        padding: 20px !important;
        border-radius: 22px !important;
    }
    .hero h1,
    .v48-hero h1 {
        font-size: clamp(30px, 11vw, 48px) !important;
        line-height: 1.02 !important;
    }
    .hero-side {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
    }
    .filters,
    .compact-filters {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        align-items: stretch !important;
    }
    .filters label,
    .filters select,
    .filters input,
    .filters .wide,
    .filters .wide select {
        width: 100% !important;
        min-width: 0 !important;
    }
    .cards-grid,
    .lean-cards,
    .acumulado-cards,
    .v48-kpis,
    .v48-aging-cards {
        grid-template-columns: 1fr 1fr !important;
    }
    .weeks-grid {
        grid-template-columns: 1fr !important;
    }
    .center-card,
    .wide-card,
    .detail-zone,
    .acumulado-board {
        border-radius: 20px !important;
        overflow-x: auto;
    }
    .pretty-table,
    .acumulado-table,
    .detail-table {
        min-width: 760px;
    }
    .q-modal-card {
        width: calc(100vw - 20px) !important;
        max-height: calc(100vh - 24px) !important;
        border-radius: 20px !important;
        padding: 16px !important;
    }
}
@media (max-width: 560px) {
    .filters,
    .compact-filters,
    .cards-grid,
    .lean-cards,
    .acumulado-cards,
    .v48-kpis,
    .v48-aging-cards,
    .hero-side,
    .client-doc-detail summary {
        grid-template-columns: 1fr !important;
    }
    .metric-card strong,
    .v48-kpi strong {
        font-size: 25px !important;
    }
    .section-title {
        font-size: 13px;
    }
}


/* ===== SOLO FACTURACIÓN ACUMULADA: full background y modales limpios ===== */
.facturacion-acumulado-page::before {
    content: "";
    position: fixed;
    inset: 0;
    background-image: url("/img/ns-quell-logo-original.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: min(82vw, 82vh) auto;
    opacity: .045;
    pointer-events: none;
    z-index: 0;
    filter: grayscale(.05) drop-shadow(0 22px 55px rgba(0,63,136,.12));
}
.facturacion-acumulado-page {
    position: relative;
    z-index: 1;
}
.facturacion-acumulado-page .metric-card.alerta:before {
    background: var(--alerta) !important;
}
.facturacion-acumulado-page .metric-card.alerta {
    border-color: rgba(255,191,0,.78) !important;
}
.facturacion-acumulado-page .modal-chart-wrap {
    margin-bottom: 0 !important;
}
@media (max-width: 640px) {
    .facturacion-acumulado-page::before {
        background-size: 115vw auto;
        opacity: .032;
    }
}


/* ===== V64: responsive tables, finalized statuses, clear chart info ===== */
.chart-floating-info {
    margin: 8px 0 0;
    padding: 10px 12px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    border-radius: 14px;
    color: var(--ns-blue);
    font-weight: 850;
}
.future-row td,
.week-chip.future {
    background: #fff9dc !important;
}
.week-chip.ok,
.metric-card.ok,
.indicator-row .pill.ok,
.pretty-table tr.ok td,
.month-total-card.ok {
    border-color: rgba(0,166,81,.55) !important;
}
.week-chip.alerta,
.metric-card.alerta,
.pretty-table tr.alerta td,
.month-total-card.alerta {
    border-color: rgba(255,191,0,.85) !important;
}
.week-chip.critico,
.metric-card.critico,
.pretty-table tr.critico td,
.month-total-card.critico {
    border-color: rgba(227,38,38,.80) !important;
}
.detail-wrapper.hidden {
    display: none !important;
}
.acumulado-full-detail {
    margin-top: 18px;
}
.acumulado-full-detail .detail-btn {
    margin-bottom: 12px;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    max-width: 100%;
}
@media (max-width: 1180px) {
    .page-shell {
        padding: 14px;
    }
    .cards-grid,
    .lean-cards,
    .acumulado-cards,
    .v48-kpis,
    .v47-kpis,
    .v48-aging-cards,
    .v47-aging-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .dashboard-grid,
    .no-week-column,
    .main-layout {
        grid-template-columns: 1fr !important;
    }
    .weeks-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .wide-card,
    .center-card,
    .detail-zone,
    .acumulado-board,
    .cxc-panel,
    .v48-projection,
    .v47-projection {
        overflow-x: auto;
    }
    .pretty-table,
    .acumulado-table,
    .detail-table,
    .cxc-table,
    .v48-board-table,
    .v47-board-table {
        min-width: 860px;
    }
}
@media (max-width: 680px) {
    .top-nav-tabs {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .hero,
    .compact-hero,
    .v48-hero,
    .v47-hero {
        display: grid !important;
        grid-template-columns: 1fr !important;
        padding: 18px !important;
        border-radius: 22px !important;
    }
    .hero h1,
    .compact-hero h1,
    .v48-hero h1,
    .v47-hero h1 {
        font-size: clamp(30px, 12vw, 44px) !important;
        line-height: 1.03 !important;
    }
    .hero-side,
    .cards-grid,
    .lean-cards,
    .acumulado-cards,
    .v48-kpis,
    .v47-kpis,
    .v48-aging-cards,
    .v47-aging-cards,
    .weeks-grid {
        grid-template-columns: 1fr !important;
    }
    .filters,
    .compact-filters {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }
    .filters select,
    .filters input,
    .filters .wide,
    .filters .week-select select {
        min-width: 0 !important;
        width: 100% !important;
    }
    .q-modal-card {
        width: calc(100vw - 18px) !important;
        max-height: calc(100vh - 18px) !important;
        padding: 14px !important;
        border-radius: 20px !important;
    }
    .modal-actions,
    .modal-chart-controls {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }
    .modal-actions .mini-btn,
    .modal-chart-controls select {
        width: 100% !important;
    }
    .metric-card strong {
        font-size: 26px !important;
    }
}


/* ===== V65 executive charts and clean responsive detail ===== */
.responsive-table-box,
.detail-wrapper,
.acumulado-doc-groups,
.cxc-detail-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: visible;
}
.detail-wrapper.hidden { display: none !important; }
.acumulado-full-detail { margin-top: 18px; }
.acumulado-full-detail .detail-btn { margin-bottom: 12px; }
.acumulado-doc-table,
.detail-table,
.pretty-table,
.acumulado-table,
.cxc-table,
.v48-board-table,
.v47-board-table {
    border-collapse: separate;
    border-spacing: 0;
}
.chart-floating-info {
    margin: 10px 0 0;
    padding: 10px 12px;
    background: #f4f8fc;
    border: 1px solid var(--ns-line);
    border-radius: 14px;
    color: var(--ns-blue);
    font-weight: 850;
}
.modal-chart-wrap {
    min-height: 360px;
}
.modal-chart-wrap canvas,
.projection-chart-wrap canvas,
.client-chart-box canvas {
    max-width: 100% !important;
}
.q-modal-card {
    max-width: min(1240px, calc(100vw - 28px)) !important;
}
.client-doc-detail summary {
    gap: 12px;
}
.future-row td,
.week-chip.future {
    background: #fff9dc !important;
}
.metric-card.ok, .week-chip.ok, .month-total-card.ok { border-color: rgba(0,166,81,.60) !important; }
.metric-card.alerta, .week-chip.alerta, .month-total-card.alerta { border-color: rgba(255,191,0,.85) !important; }
.metric-card.critico, .week-chip.critico, .month-total-card.critico { border-color: rgba(227,38,38,.80) !important; }
@media (max-width: 1180px) {
    .page-shell { padding: 14px; }
    .cards-grid,.lean-cards,.acumulado-cards,.v48-kpis,.v47-kpis,.v48-aging-cards,.v47-aging-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .dashboard-grid,.no-week-column,.main-layout { grid-template-columns: 1fr !important; }
    .weeks-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .wide-card,.center-card,.detail-zone,.acumulado-board,.cxc-panel,.v48-projection,.v47-projection { overflow-x: auto; }
    .pretty-table,.acumulado-table,.detail-table,.cxc-table,.v48-board-table,.v47-board-table { min-width: 860px; }
}
@media (max-width: 680px) {
    .top-nav-tabs { display: grid; grid-template-columns: 1fr; gap: 8px; }
    .hero,.compact-hero,.v48-hero,.v47-hero { display: grid !important; grid-template-columns: 1fr !important; padding: 18px !important; border-radius: 22px !important; }
    .hero h1,.compact-hero h1,.v48-hero h1,.v47-hero h1 { font-size: clamp(30px, 12vw, 44px) !important; line-height: 1.03 !important; }
    .hero-side,.cards-grid,.lean-cards,.acumulado-cards,.v48-kpis,.v47-kpis,.v48-aging-cards,.v47-aging-cards,.weeks-grid { grid-template-columns: 1fr !important; }
    .filters,.compact-filters { display: grid !important; grid-template-columns: 1fr !important; }
    .filters select,.filters input,.filters .wide,.filters .week-select select { min-width: 0 !important; width: 100% !important; }
    .q-modal-card { width: calc(100vw - 18px) !important; max-height: calc(100vh - 18px) !important; padding: 14px !important; border-radius: 20px !important; }
    .modal-actions,.modal-chart-controls { display: grid !important; grid-template-columns: 1fr !important; }
    .modal-actions .mini-btn,.modal-chart-controls select { width: 100% !important; }
    .metric-card strong { font-size: 26px !important; }
    .modal-chart-wrap { min-height: 300px; padding: 10px !important; }
}


/* =========================================================
   V66 FIX DEFINITIVO MOBILE - TABLAS DETALLE
   Evita cortes laterales en consulta completa y detalle cliente.
   En celular las tablas se vuelven tarjetas legibles.
   ========================================================= */

html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.page-shell {
    width: min(100%, 1700px);
    max-width: 1700px;
    overflow-x: hidden;
}

.detail-zone-mobile-safe,
.detail-zone,
.acumulado-full-detail,
.client-document-groups,
.client-doc-detail,
#detailTable,
#acumuladoDetailTable {
    min-width: 0 !important;
    max-width: 100% !important;
}

#detailTable.hidden,
#acumuladoDetailTable.hidden {
    display: none !important;
}

.ns-table-scroll {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    border-radius: 16px;
}

.ns-responsive-table {
    width: 100%;
    min-width: 820px;
    border-collapse: collapse;
}

.ns-document-table {
    min-width: 1120px;
}

.ns-acumulado-full-table {
    min-width: 1180px;
}

.client-document-groups {
    width: 100%;
    display: grid;
    gap: 12px;
}

.client-doc-detail {
    width: 100%;
    overflow: hidden;
}

.client-doc-detail summary {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 10px;
    align-items: center;
}

.client-doc-detail summary b {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* MOBILE REAL: tabla -> tarjetas */
@media (max-width: 760px) {
    .page-shell {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        overflow-x: hidden !important;
    }

    .detail-zone-mobile-safe,
    .detail-zone,
    .acumulado-full-detail,
    .center-card,
    .wide-card,
    .acumulado-board {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 10px !important;
        overflow: visible !important;
        border-radius: 18px !important;
    }

    #detailTable,
    #acumuladoDetailTable {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
        border: 0 !important;
        max-height: none !important;
    }

    #detailTable .section-title,
    #acumuladoDetailTable .section-title {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 12px !important;
        border-radius: 16px 16px 0 0 !important;
        text-align: left !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
        position: static !important;
    }

    #detailTable .section-title span,
    #acumuladoDetailTable .section-title span {
        white-space: normal !important;
        word-break: break-word !important;
    }

    #detailTable .mini-actions,
    #acumuladoDetailTable .mini-actions {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
    }

    #detailTable .mini-actions button,
    #acumuladoDetailTable .mini-actions button {
        width: 100% !important;
    }

    .client-doc-detail {
        border-radius: 16px !important;
        overflow: hidden !important;
        background: #fff !important;
        border: 1px solid #cfe3f6 !important;
        box-shadow: 0 10px 22px rgba(0,63,136,.06) !important;
    }

    .client-doc-detail summary {
        grid-template-columns: 1fr !important;
        gap: 6px !important;
        padding: 12px !important;
    }

    .client-doc-detail summary b,
    .client-doc-detail summary span,
    .client-doc-detail summary i {
        width: 100% !important;
        max-width: 100% !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: unset !important;
        word-break: break-word !important;
    }

    .ns-table-scroll {
        overflow: visible !important;
        border-radius: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .ns-responsive-table,
    .ns-document-table,
    .ns-client-detail-table,
    .ns-acumulado-full-table {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: block !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
    }

    .ns-responsive-table thead {
        display: none !important;
    }

    .ns-responsive-table tbody {
        display: grid !important;
        gap: 10px !important;
        width: 100% !important;
    }

    .ns-responsive-table tr {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 10px 12px !important;
        border: 1px solid #cfe3f6 !important;
        border-radius: 14px !important;
        background: #ffffff !important;
        box-shadow: 0 10px 24px rgba(0,63,136,.08) !important;
    }

    .ns-responsive-table td {
        display: grid !important;
        grid-template-columns: 92px minmax(0, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #edf4fb !important;
        padding: 7px 0 !important;
        text-align: right !important;
        white-space: normal !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
        font-size: 12px !important;
        background: transparent !important;
    }

    .ns-responsive-table td:last-child {
        border-bottom: 0 !important;
    }

    .ns-responsive-table td::before {
        content: attr(data-label);
        text-align: left;
        color: #003f88;
        font-weight: 950;
        text-transform: uppercase;
        font-size: 10px;
        letter-spacing: .04em;
    }

    .ns-document-table td[data-label="Cliente"],
    .ns-document-table td[data-label="CFDI"],
    .ns-acumulado-full-table td[data-label="Periodo"] {
        grid-template-columns: 1fr !important;
        text-align: left !important;
    }

    .ns-document-table td[data-label="Cliente"]::before,
    .ns-document-table td[data-label="CFDI"]::before,
    .ns-acumulado-full-table td[data-label="Periodo"]::before {
        margin-bottom: 3px;
    }
}


/* =========================================================
   V67 ACUMULADO - OCULTAR TODO EL DETALLE HASTA CLIC
   ========================================================= */
#acumuladoDetailTable.hidden,
#detailTable.hidden {
    display: none !important;
}

#acumuladoDetailTable.detail-wrapper.hidden,
.detail-wrapper.hidden {
    display: none !important;
}

.acumulado-full-detail > #acumuladoDetailTable.hidden {
    display: none !important;
}

/* Cuando está oculto, nada interno debe ocupar espacio */
#acumuladoDetailTable.hidden *,
#detailTable.hidden * {
    display: none !important;
}

/* Detalle por mes/factura dentro del bloque desplegable */
#acumuladoDetailTable {
    margin-top: 14px;
    width: 100%;
    max-width: 100%;
    overflow: visible;
}

#acumuladoDetailTable .detail-subtitle {
    margin-top: 16px;
}

.ns-acumulado-doc-table {
    min-width: 1080px;
}

@media (max-width: 760px) {
    .ns-acumulado-doc-table {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: block !important;
    }

    .ns-acumulado-doc-table thead {
        display: none !important;
    }

    .ns-acumulado-doc-table tbody {
        display: grid !important;
        gap: 10px !important;
    }

    .ns-acumulado-doc-table tr {
        display: block !important;
        width: 100% !important;
        padding: 10px 12px !important;
        border: 1px solid #cfe3f6 !important;
        border-radius: 14px !important;
        background: #fff !important;
        box-shadow: 0 10px 24px rgba(0,63,136,.08) !important;
    }

    .ns-acumulado-doc-table td {
        display: grid !important;
        grid-template-columns: 92px minmax(0, 1fr) !important;
        gap: 8px !important;
        border: 0 !important;
        border-bottom: 1px solid #edf4fb !important;
        padding: 7px 0 !important;
        text-align: right !important;
        white-space: normal !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
        font-size: 12px !important;
        background: transparent !important;
    }

    .ns-acumulado-doc-table td:last-child {
        border-bottom: 0 !important;
    }

    .ns-acumulado-doc-table td::before {
        content: attr(data-label);
        text-align: left;
        color: #003f88;
        font-weight: 950;
        text-transform: uppercase;
        font-size: 10px;
        letter-spacing: .04em;
    }

    .ns-acumulado-doc-table td[data-label="Cliente"],
    .ns-acumulado-doc-table td[data-label="CFDI"] {
        grid-template-columns: 1fr !important;
        text-align: left !important;
    }
}


/* =========================================================
   V68 FIX CARTERA CLIENTES MOBILE
   Tabla Cartera por cliente -> tarjetas limpias en celular.
   Evita corte horizontal en Galaxy / móvil.
   ========================================================= */

.client-board-body,
#clientBoardBody,
#clientBoardTable {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

#clientBoardBody {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
}

#clientBoardTable {
    min-width: 980px;
}

.client-detail-cell {
    padding: 0 !important;
}

.client-invoices-container {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.ns-invoice-mobile-table {
    min-width: 820px;
}

/* limpia los controles superiores para que no se salgan */
.cxc-bottom-board .section-title-actions {
    align-items: flex-start;
}

.cxc-bottom-board .mini-actions {
    max-width: 100%;
    min-width: 0;
}

.cxc-bottom-board .mini-actions .mini-btn,
.cxc-bottom-board .mini-actions .cxc-select,
.cxc-bottom-board .mini-actions .cxc-search {
    min-width: 0;
}

/* MOBILE REAL */
@media (max-width: 760px) {
    .cxc-bottom-board {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
        border-radius: 18px !important;
    }

    .cxc-bottom-board .section-title-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        padding: 14px !important;
        text-align: left !important;
        position: static !important;
    }

    .cxc-bottom-board .section-title-actions > span {
        white-space: normal !important;
        word-break: break-word !important;
    }

    .cxc-bottom-board .mini-actions {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .cxc-bottom-board .mini-actions .mini-btn,
    .cxc-bottom-board .mini-actions .cxc-select,
    .cxc-bottom-board .mini-actions .cxc-search {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 38px !important;
        font-size: 12px !important;
    }

    .cxc-bottom-board .mini-actions .cxc-search,
    .cxc-bottom-board .mini-actions .cxc-select {
        grid-column: 1 / -1 !important;
    }

    #clientBoardBody,
    .client-board-body {
        overflow: visible !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    #clientBoardTable,
    .ns-client-board-table {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: block !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
    }

    #clientBoardTable thead {
        display: none !important;
    }

    #clientBoardTable tbody {
        display: grid !important;
        gap: 10px !important;
        width: 100% !important;
    }

    #clientBoardTable tr.client-main-row {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 11px 12px !important;
        border: 1px solid #cfe3f6 !important;
        border-left: 6px solid var(--ns-blue) !important;
        border-radius: 16px !important;
        background: #ffffff !important;
        box-shadow: 0 10px 24px rgba(0,63,136,.08) !important;
    }

    #clientBoardTable tr.client-main-row:hover {
        transform: none !important;
    }

    #clientBoardTable tr.client-main-row td {
        display: grid !important;
        grid-template-columns: 104px minmax(0, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #edf4fb !important;
        padding: 7px 0 !important;
        text-align: right !important;
        white-space: normal !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
        font-size: 12px !important;
        background: transparent !important;
    }

    #clientBoardTable tr.client-main-row td:last-child {
        border-bottom: 0 !important;
    }

    #clientBoardTable tr.client-main-row td::before {
        content: attr(data-label);
        text-align: left;
        color: #003f88;
        font-weight: 950;
        text-transform: uppercase;
        font-size: 10px;
        letter-spacing: .04em;
    }

    #clientBoardTable tr.client-main-row td.client-name-cell {
        grid-template-columns: auto minmax(0, 1fr) !important;
        align-items: center !important;
        text-align: left !important;
    }

    #clientBoardTable tr.client-main-row td.client-name-cell::before {
        display: none !important;
    }

    #clientBoardTable tr.client-main-row td.client-name-cell b {
        min-width: 0 !important;
        max-width: 100% !important;
        white-space: normal !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
        color: #001e5a !important;
    }

    #clientBoardTable tr.client-detail-row {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
    }

    #clientBoardTable tr.client-detail-row.hidden {
        display: none !important;
    }

    #clientBoardTable tr.client-detail-row td.client-detail-cell {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        border: 0 !important;
        padding: 0 !important;
        background: transparent !important;
    }

    .client-invoices-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-top: -6px !important;
        margin-bottom: 10px !important;
        padding: 10px !important;
        border-left: 0 !important;
        border-radius: 16px !important;
        background: #fbfdff !important;
        border: 1px solid #cfe3f6 !important;
    }

    .invoice-expand-head {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .client-chart-box {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    .client-chart-box canvas {
        max-width: 100% !important;
    }

    .invoice-scroll,
    .invoice-scroll.ns-table-scroll {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        border: 0 !important;
        max-height: none !important;
    }

    .ns-invoice-mobile-table {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: block !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
    }

    .ns-invoice-mobile-table thead {
        display: none !important;
    }

    .ns-invoice-mobile-table tbody {
        display: grid !important;
        gap: 10px !important;
        width: 100% !important;
    }

    .ns-invoice-mobile-table tr {
        display: block !important;
        width: 100% !important;
        padding: 10px 12px !important;
        border: 1px solid #d7e6f4 !important;
        border-radius: 14px !important;
        background: #fff !important;
    }

    .ns-invoice-mobile-table td {
        display: grid !important;
        grid-template-columns: 92px minmax(0, 1fr) !important;
        gap: 8px !important;
        border: 0 !important;
        border-bottom: 1px solid #edf4fb !important;
        padding: 7px 0 !important;
        text-align: right !important;
        white-space: normal !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
        font-size: 12px !important;
        background: transparent !important;
    }

    .ns-invoice-mobile-table td:last-child {
        border-bottom: 0 !important;
    }

    .ns-invoice-mobile-table td::before {
        content: attr(data-label);
        text-align: left;
        color: #003f88;
        font-weight: 950;
        text-transform: uppercase;
        font-size: 10px;
        letter-spacing: .04em;
    }

    .status-pill {
        justify-self: end !important;
    }
}


/* =========================================================
   V69 FIX CARTERA - ACUMULADO POR SEMANA MOBILE
   La tabla "Acumulado por semana" ya no se corta en celular.
   ========================================================= */

.v48-weekly-mobile-safe,
.v48-weekly-mobile-safe .weekly-table-scroll,
.v48-weekly-mobile-safe .ns-weekly-mobile-table {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.v48-weekly-mobile-safe .weekly-table-scroll {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
}

.v48-weekly-mobile-safe .ns-weekly-mobile-table {
    min-width: 720px;
}

@media (max-width: 760px) {
    .v48-weekly-mobile-safe {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
        border-radius: 18px !important;
    }

    .v48-weekly-mobile-safe .section-title {
        position: static !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 12px !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
        white-space: normal !important;
        word-break: break-word !important;
    }

    .v48-weekly-mobile-safe .weekly-table-scroll {
        overflow: visible !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: block !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table thead {
        display: none !important;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table tbody {
        display: grid !important;
        gap: 10px !important;
        width: 100% !important;
        padding: 10px !important;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table tr {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 11px 12px !important;
        border: 1px solid #cfe3f6 !important;
        border-left: 6px solid var(--ns-orange) !important;
        border-radius: 16px !important;
        background: #ffffff !important;
        box-shadow: 0 10px 24px rgba(0,63,136,.08) !important;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table tr:hover {
        transform: none !important;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table td {
        display: grid !important;
        grid-template-columns: 96px minmax(0, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #edf4fb !important;
        padding: 7px 0 !important;
        text-align: right !important;
        white-space: normal !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
        font-size: 12px !important;
        background: transparent !important;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table td:last-child {
        border-bottom: 0 !important;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table td::before {
        content: attr(data-label);
        text-align: left;
        color: #003f88;
        font-weight: 950;
        text-transform: uppercase;
        font-size: 10px;
        letter-spacing: .04em;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table td[data-label="Semana"] {
        grid-template-columns: 1fr !important;
        text-align: left !important;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table td[data-label="Semana"]::before {
        display: none !important;
    }

    .v48-weekly-mobile-safe .ns-weekly-mobile-table td[data-label="Semana"] b {
        display: inline-block;
        color: #003f88;
        font-size: 14px;
        font-weight: 950;
    }
}


/* =========================================================
   V70 FIX REAL - ACUMULADO POR SEMANA MOBILE
   En móvil se oculta la tabla y se muestran tarjetas limpias.
   ========================================================= */

.v48-weekly-mobile-safe {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
}

.v48-weekly-mobile-safe .weekly-table-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.v48-weekly-mobile-safe .ns-weekly-mobile-table {
    width: 100%;
    min-width: 720px;
}

.weekly-mobile-cards {
    display: none;
}

.weekly-mobile-card {
    width: 100%;
    border: 1px solid #cfe3f6;
    border-left: 7px solid var(--ns-orange);
    border-radius: 16px;
    background: #fff;
    padding: 12px;
    text-align: left;
    box-shadow: 0 10px 24px rgba(0,63,136,.08);
    cursor: pointer;
}

.weekly-mobile-card span {
    display: block;
    color: var(--ns-blue);
    font-size: 13px;
    font-weight: 950;
    text-transform: uppercase;
}

.weekly-mobile-card b {
    display: block;
    margin: 4px 0 10px;
    color: #20384d;
    font-size: 12px;
}

.weekly-mobile-card small {
    display: block;
    color: #63758a;
    font-size: 10px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.weekly-mobile-card strong {
    display: block;
    margin: 2px 0 9px;
    color: var(--ns-blue);
    font-size: 18px;
    font-weight: 950;
}

@media (max-width: 760px) {
    .v48-weekly-mobile-safe {
        border-radius: 18px !important;
        overflow: hidden !important;
    }

    .v48-weekly-mobile-safe .section-title {
        position: static !important;
        width: 100% !important;
        padding: 12px !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
        white-space: normal !important;
    }

    .v48-weekly-mobile-safe .weekly-table-scroll {
        display: none !important;
    }

    .v48-weekly-mobile-safe .weekly-mobile-cards {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        padding: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        background: #f7fbff;
    }
}