:root {
    --nxd-navy: #071B3C;
    --nxd-navy-2: #123F7B;
    --nxd-gold: #D5A13A;
    --nxd-gold-light: #FCDB99;
    --nxd-bg: #F4F7FB;
    --nxd-border: rgba(7, 27, 60, .10);
    --nxd-muted: #758198;
}

.nexus-dashboard-page {
    color: var(--nxd-navy);
    background: var(--nxd-bg);
}

.nexus-dashboard-hero {
    position: relative;
    overflow: hidden;
}

.nexus-dashboard-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 75% 20%, rgba(252,219,153,.16), transparent 30%),
        linear-gradient(180deg, transparent 55%, rgba(7,27,60,.18));
}

.nexus-dashboard-hero .nexus-management-page__hero-content {
    position: relative;
    z-index: 1;
    max-width: 760px;
}

.nexus-dashboard-hero__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 22px;
}

.nexus-dashboard-hero__chips span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    color: rgba(255,255,255,.88);
    background: rgba(255,255,255,.07);
    backdrop-filter: blur(8px);
    font-size: 12.5px;
}

.nexus-dashboard-hero__chips i { color: #F4C863; }

.nexus-dashboard-main {
    padding-bottom: 64px;
    background: linear-gradient(180deg, #F5F8FC 0%, #EEF3F9 100%);
}

.nexus-dashboard-shell {
    overflow: hidden;
    border: 1px solid var(--nxd-border);
    border-radius: 24px;
    background: linear-gradient(145deg, #FFF 0%, #FBFCFF 72%, #FFFAF1 100%);
    box-shadow: 0 22px 58px rgba(7,27,60,.09);
}

.nexus-dashboard-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 24px 28px;
    border-bottom: 1px solid rgba(7,27,60,.08);
}

.nexus-dashboard-kicker,
.nexus-dashboard-chart-card__head span {
    display: block;
    margin-bottom: 5px;
    color: #B77A00;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .14em;
}

.nexus-dashboard-toolbar h2 {
    margin: 0;
    color: var(--nxd-navy);
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -.03em;
}

.nexus-dashboard-toolbar p {
    margin: 6px 0 0;
    color: var(--nxd-muted);
    font-size: 13.5px;
}

.nexus-dashboard-filters {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

.nexus-dashboard-segmented {
    display: inline-flex;
    gap: 4px;
    padding: 4px;
    border: 1px solid var(--nxd-border);
    border-radius: 13px;
    background: #F5F8FC;
}

.nexus-dashboard-segmented button {
    min-height: 36px;
    padding: 8px 13px;
    border: 0;
    border-radius: 9px;
    color: #627086;
    background: transparent;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
}

.nexus-dashboard-segmented button:hover {
    color: var(--nxd-navy);
    background: rgba(255,255,255,.8);
}

.nexus-dashboard-segmented button.active {
    color: var(--nxd-navy);
    background: linear-gradient(135deg, #E6B94F 0%, #FCDB99 52%, #FFCC73 100%);
    box-shadow: 0 5px 14px rgba(213,161,58,.22);
}

.nexus-dashboard-scope {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    padding: 0 12px;
    border: 1px solid var(--nxd-border);
    border-radius: 13px;
    background: #FFF;
}

.nexus-dashboard-scope i { color: var(--nxd-gold); }
.nexus-dashboard-scope select {
    min-width: 132px;
    border: 0 !important;
    outline: none !important;
    color: var(--nxd-navy);
    background: transparent;
    font-size: 13px;
    font-weight: 500;
}

.nexus-dashboard-body { padding: 26px 28px 30px; }

.nexus-dashboard-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.nexus-dashboard-metric {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--nxd-border);
    border-radius: 18px;
    background: #FFF;
    box-shadow: 0 10px 28px rgba(7,27,60,.055);
}

.nexus-dashboard-metric__icon {
    display: grid;
    place-items: center;
    flex: 0 0 50px;
    width: 50px;
    height: 50px;
    border-radius: 15px;
    font-size: 20px;
}

.nexus-dashboard-metric--flight .nexus-dashboard-metric__icon {
    color: #FFF;
    background: linear-gradient(135deg, #174E91, #071B3C);
}
.nexus-dashboard-metric--hotel .nexus-dashboard-metric__icon {
    color: #715000;
    background: linear-gradient(135deg, #E6B94F, #FCDB99);
}
.nexus-dashboard-metric--balance .nexus-dashboard-metric__icon {
    color: #FFF;
    background: linear-gradient(135deg, #2DB276, #117847);
}

.nexus-dashboard-metric span {
    display: block;
    color: #7A879A;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
}
.nexus-dashboard-metric strong {
    display: block;
    margin-top: 4px;
    color: var(--nxd-navy);
    font-size: 23px;
    font-weight: 700;
    line-height: 1.1;
}
.nexus-dashboard-metric small {
    display: block;
    margin-top: 4px;
    color: #99A3B2;
    font-size: 11.5px;
}

.nexus-dashboard-chart-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 18px;
}

.nexus-dashboard-chart-card {
    min-width: 0;
    border: 1px solid var(--nxd-border);
    border-radius: 19px;
    background: #FFF;
    box-shadow: 0 10px 30px rgba(7,27,60,.055);
}

.nexus-dashboard-chart-card__head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 18px 10px;
}

.nexus-dashboard-chart-card__icon {
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    color: var(--nxd-navy);
    background: linear-gradient(135deg, #FFF1C9, #FFF9ED);
    border: 1px solid rgba(213,161,58,.18);
    font-size: 17px;
}

.nexus-dashboard-chart-card h3 {
    margin: 0;
    color: var(--nxd-navy);
    font-size: 18px;
    font-weight: 650;
    letter-spacing: -.02em;
}

.nexus-dashboard-chart-card__canvas {
    position: relative;
    padding: 4px 14px 16px;
}

.nexus-dashboard-chart-card__canvas--compact {
    min-height: 300px;
}

.nexus-dashboard-chart-card__canvas--compact canvas {
    width: 100% !important;
    max-height: 300px !important;
}

.nexus-dashboard-chart-card--wide { margin-top: 18px; }
.nexus-dashboard-chart-card__head--wide {
    justify-content: space-between;
    padding: 22px 24px 8px;
}
.nexus-dashboard-chart-card__head--wide p {
    margin: 5px 0 0;
    color: var(--nxd-muted);
    font-size: 13px;
}
.nexus-dashboard-chart-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 36px;
    padding: 8px 12px;
    border-radius: 999px;
    color: var(--nxd-navy);
    background: #FFF7E5;
    border: 1px solid rgba(213,161,58,.20);
    font-size: 12px;
    font-weight: 600;
}
.nexus-dashboard-chart-card__canvas--wide {
    min-height: 390px;
    padding: 8px 20px 22px;
}
.nexus-dashboard-chart-card__canvas--wide canvas {
    width: 100% !important;
    max-height: 390px !important;
}

.nexus-dashboard-page .d-none { display: none !important; }

@media (max-width: 1199.98px) {
    .nexus-dashboard-toolbar { align-items: flex-start; }
    .nexus-dashboard-filters { flex-wrap: wrap; justify-content: flex-end; }
    .nexus-dashboard-chart-grid { grid-template-columns: 1fr 1fr; }
    .nexus-dashboard-chart-grid > :last-child { grid-column: 1 / -1; }
}

@media (max-width: 991.98px) {
    .nexus-dashboard-toolbar { display: block; }
    .nexus-dashboard-filters { margin-top: 18px; justify-content: flex-start; }
    .nexus-dashboard-metrics { grid-template-columns: 1fr; }
    .nexus-dashboard-chart-grid { grid-template-columns: 1fr; }
    .nexus-dashboard-chart-grid > :last-child { grid-column: auto; }
}

@media (max-width: 767.98px) {
    .nexus-dashboard-hero__chips { display: none; }
    .nexus-dashboard-toolbar,
    .nexus-dashboard-body { padding: 18px; }
    .nexus-dashboard-toolbar h2 { font-size: 23px; }
    .nexus-dashboard-filters { display: block; }
    .nexus-dashboard-segmented { width: 100%; }
    .nexus-dashboard-segmented button { flex: 1 1 0; padding-inline: 8px; }
    .nexus-dashboard-scope { width: 100%; margin-top: 10px; }
    .nexus-dashboard-scope select { flex: 1; }
    .nexus-dashboard-chart-card__head--wide { align-items: flex-start; gap: 14px; }
    .nexus-dashboard-chart-badge { display: none; }
}
