/* =====================================================
   V2_DASH_HEADER.CSS
   Header condiviso per dashboard utente.
===================================================== */

.v2-dash-user .dashboard-header {
    --header-accent:#45c7df;
    --header-accent-soft:#e7f9fc;
    --header-accent-line:#a9e8f1;
    --header-accent-text:#0b7182;
    width:100%;
    margin-bottom:48px;
}

.v2-dash-user .unified-dashboard-card {
    display:grid;
    grid-template-columns:minmax(390px, 46%) 1px minmax(390px, 1fr);
    gap:28px;
    align-items:start;
    padding:28px;
}

.v2-dash-user .dashboard-left {
    width:100%;
}

.v2-dash-user .dashboard-left-top {
    width:100%;
    display:grid;
    grid-template-columns:minmax(0, 1fr) 1px minmax(138px, auto);
    gap:20px;
    align-items:start;
}

.v2-dash-user .identity-area {
    display:flex;
    flex-direction:column;
    gap:14px;
    min-width:0;
}

.v2-dash-user .identity-block {
    display:grid;
    grid-template-columns:68px 1fr;
    gap:16px;
    align-items:center;
    min-width:0;
}

.v2-dash-user .brand-icon {
    width:68px;
    height:68px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    object-fit:contain;
    object-position:center;
    display:block;
}

.v2-dash-user .brand-icon.account-avatar {
    width:68px;
    height:68px;
    border:3px solid rgba(69, 199, 223, .45);
    border-radius:999px;
    background:#ffffff;
    object-fit:cover;
    box-shadow:0 12px 28px rgba(20, 50, 74, .12);
}

.v2-dash-user .brand-icon.account-avatar.is-fallback {
    padding:8px;
    object-fit:contain;
}

.v2-dash-user .header-back-row {
    display:flex;
    justify-content:flex-start;
    margin-top:10px;
    margin-left:84px;
}

.v2-dash-user .header-back-btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:8px 14px;
    border:1px solid var(--header-accent-line);
    border-radius:999px;
    background:var(--header-accent-soft);
    color:var(--header-accent-text);
    font-size:12px;
    font-weight:900;
    letter-spacing:.04em;
    text-decoration:none;
    text-transform:uppercase;
}

.v2-dash-user .header-back-btn:hover {
    text-decoration:none;
}

.v2-dash-user .person-name h1 {
    margin:0;
    color:var(--text);
    font-size:31px;
    line-height:1.05;
    font-weight:900;
    letter-spacing:0;
}

.v2-dash-user .person-name .connected-account-name {
    max-width:320px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    line-height:1.12;
}

.v2-dash-user .connected-account-label {
    margin-top:12px;
    color:var(--header-accent-text);
    font-size:11px;
    line-height:1.15;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.v2-dash-user .left-divider,
.v2-dash-user .vertical-divider {
    width:1px;
    min-height:100%;
    background:var(--line);
}

.v2-dash-user .kpi-block {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    padding:0;
}

.v2-dash-user .main-counter-label {
    margin:0 0 10px;
    color:var(--header-accent-text);
    font-size:13px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.v2-dash-user .main-counter-number {
    color:var(--header-accent);
    font-size:64px;
    line-height:.88;
    font-weight:900;
    letter-spacing:0;
}

.v2-dash-user .sales-panel {
    width:100%;
    padding-top:14px;
    border-top:1px solid var(--line);
}

.v2-dash-user .dashboard-right {
    padding:0;
}

.v2-dash-user .dashboard-right h2 {
    margin:0 0 12px;
    color:var(--header-accent-text);
    font-size:18px;
    line-height:1.2;
    font-weight:900;
    letter-spacing:0;
}

.v2-dash-user .separator {
    height:1px;
    margin:14px 0;
    background:var(--line);
    border:0;
}

.v2-dash-user .status-summary {
    width:100%;
}

.v2-dash-user .metric-row {
    display:grid;
    grid-template-columns:minmax(0, 170px) minmax(0, 1fr) minmax(42px, max-content);
    gap:12px;
    align-items:center;
    min-height:34px;
    margin:8px 0;
    cursor:pointer;
    min-width:0;
}

.v2-dash-user .metric-row.disabled-filter {
    cursor:default;
    pointer-events:none;
}

.v2-dash-user .metric-label {
    color:var(--text);
    font-size:13px;
    font-weight:850;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    min-width:0;
}

.v2-dash-user .metric-value {
    color:var(--muted);
    font-size:13px;
    font-weight:850;
    text-align:right;
    white-space:nowrap;
    min-width:0;
}

.v2-dash-user .progress {
    width:100%;
    height:8px;
    overflow:hidden;
    background:#e8edf4;
    border-radius:999px;
}

.v2-dash-user .progress-fill {
    width:var(--final-width);
    height:100%;
    border-radius:999px;
}

.v2-dash-user .status-nei-tempi-previsti {
    background:var(--green);
}

.v2-dash-user .status-a-rischio {
    background:var(--yellow);
}

.v2-dash-user .status-in-ritardo {
    background:var(--red);
}

/* Colori status centralizzati nell'header: le pagine non devono ridefinire le barre. */
.v2-dash-user .dashboard-right .progress-fill.status-nei-tempi-previsti {
    background:var(--green);
}

.v2-dash-user .dashboard-right .progress-fill.status-a-rischio {
    background:var(--yellow);
}

.v2-dash-user .dashboard-right .progress-fill.status-in-ritardo {
    background:var(--red);
}

.v2-dash-user .filter-layout {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    width:100%;
}

.v2-dash-user .sales-panel h3 {
    margin:0 0 10px;
    color:var(--muted);
    font-size:13px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.v2-dash-user .referente-filter {
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-height:34px;
    margin:0;
    padding:8px 12px;
    border:1px solid var(--line);
    border-radius:999px;
    background:var(--panel-soft);
    text-transform:uppercase;
    cursor:pointer;
}

.v2-dash-user .referente-filter.is-selected {
    color:#ffffff;
    background:var(--red);
    border-color:var(--red);
}

.v2-dash-user .referente-filter.is-hidden-by-filter {
    display:none;
}

.v2-dash-user .referente-filter.is-hidden-by-status {
    display:none;
}

.v2-dash-user .referente-filter.is-selected .metric-label,
.v2-dash-user .referente-filter.is-selected .metric-value {
    color:#ffffff;
}

.v2-dash-user .referente-filter .metric-label,
.v2-dash-user .referente-filter .metric-value {
    width:auto;
    flex:none;
    color:var(--text);
    font-size:12px;
    text-align:left;
    text-transform:uppercase;
}

.v2-dash-user .referente-reset-filter {
    display:none;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:8px 14px;
    border:1px solid #f1b8b5;
    border-radius:999px;
    background:#ffeded;
    color:#8b2721;
    font-family:inherit;
    font-size:12px;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
    cursor:pointer;
}

.v2-dash-user .referente-reset-filter.is-visible {
    display:inline-flex;
}

@media(max-width:980px) {
    .v2-dash-user .unified-dashboard-card {
        grid-template-columns:1fr;
    }

    .v2-dash-user .vertical-divider {
        display:none;
    }

    .v2-dash-user .dashboard-left {
        width:100%;
    }

    .v2-dash-user .dashboard-left-top {
        grid-template-columns:1fr;
    }

    .v2-dash-user .left-divider {
        display:none;
    }

    .v2-dash-user .brand-icon {
        width:60px;
        height:60px;
    }

    .v2-dash-user .metric-row {
        grid-template-columns:1fr;
    }

    .v2-dash-user .metric-value {
        text-align:left;
    }
}
