/* =====================================================
       DASHBOARD REFACTOR - Layout cu ierarhie clară
       ===================================================== */

    /* Section label - separator vizual între zone */
    .dash-section-label{
      font-size:11px;
      font-weight:900;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:var(--muted);
      margin:28px 4px 14px;
    }
    .dash-section-label:first-child{margin-top:0}

    /* ZONA 2: KPI principale - mari, prominente */
    .dash-kpi-primary{
      display:grid;
      grid-template-columns:repeat(4, minmax(0, 1fr));
      gap:14px;
      margin-bottom:8px;
    }

    /* ZONA 3: KPI secundare - mai mici, mai subtile */
    .dash-kpi-secondary{
      display:grid;
      grid-template-columns:repeat(4, minmax(0, 1fr));
      gap:14px;
      margin-bottom:8px;
    }

    /* KPI cards - shared base */
    .dash-kpi-card{
      background:white;
      border:1px solid var(--line);
      border-radius:20px;
      padding:18px;
      transition:.18s ease;
    }
    .dash-kpi-card:hover{
      transform:translateY(-2px);
      box-shadow:0 18px 40px rgba(44,52,24,.10);
    }

    /* Primary variant - larger, more emphasis */
    .dash-kpi-card.primary{
      box-shadow:0 14px 36px rgba(44,52,24,.07);
    }
    .dash-kpi-card.primary .dash-kpi-label{
      font-size:13px;
      font-weight:950;
      color:#61700d;
      letter-spacing:.02em;
    }
    .dash-kpi-card.primary .dash-kpi-value{
      font-size:34px;
      font-weight:950;
      letter-spacing:-.045em;
      color:#151b2d;
      margin:8px 0 4px;
      line-height:1.05;
    }
    .dash-kpi-card.primary .dash-kpi-sub{
      font-size:12px;
      color:var(--muted);
    }

    /* Secondary variant - smaller, subtle */
    .dash-kpi-card.secondary{
      background:rgba(255,255,255,.6);
      box-shadow:none;
    }
    .dash-kpi-card.secondary .dash-kpi-label{
      font-size:12px;
      font-weight:850;
      color:var(--muted);
      letter-spacing:.02em;
      text-transform:uppercase;
    }
    .dash-kpi-card.secondary .dash-kpi-value{
      font-size:24px;
      font-weight:900;
      letter-spacing:-.03em;
      color:#2a3245;
      margin:6px 0 4px;
      line-height:1.05;
    }
    .dash-kpi-card.secondary .dash-kpi-sub{
      font-size:11px;
      color:var(--muted);
    }

    /* Responsive - tablet */
    @media(max-width:1180px){
      .dash-kpi-primary{grid-template-columns:repeat(2, 1fr)}
      .dash-kpi-secondary{grid-template-columns:repeat(2, 1fr)}
    }

    /* Responsive - mobile */
    @media(max-width:720px){
      .dash-kpi-primary{grid-template-columns:1fr}
      .dash-kpi-secondary{grid-template-columns:repeat(2, 1fr); gap:10px}
      .dash-kpi-card.primary .dash-kpi-value{font-size:28px}
    }


    /* Period pill - context perioadă analizată */
    .dash-period-pill{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:9px 16px;
      background:rgba(255,255,255,.7);
      border:1px solid var(--line);
      border-radius:999px;
      font-size:13px;
      margin-bottom:20px;
      box-shadow:0 8px 22px rgba(44,52,24,.05);
      backdrop-filter:blur(8px);
    }
    .dash-period-icon{
      font-size:14px;
      opacity:.8;
    }
    .dash-period-label{
      color:var(--muted);
      font-weight:700;
    }
    .dash-period-value{
      color:#3f4609;
      font-weight:900;
      letter-spacing:.01em;
    }
    .dash-period-pill.empty .dash-period-value{
      color:var(--muted);
      font-weight:700;
    }


    /* Topbar period pill - mic, discret, pe orice ecran */
    .topbar-period-pill{
      display:inline-flex;
      align-items:center;
      gap:6px;
      padding:7px 12px;
      background:rgba(255,255,255,.7);
      border:1px solid var(--line);
      border-radius:999px;
      font-size:12px;
      box-shadow:0 4px 12px rgba(44,52,24,.04);
      backdrop-filter:blur(8px);
      max-width:280px;
      white-space:nowrap;
      overflow:hidden;
    }
    .topbar-period-icon{
      font-size:12px;
      opacity:.75;
      flex-shrink:0;
    }
    .topbar-period-value{
      color:#3f4609;
      font-weight:850;
      letter-spacing:.01em;
      overflow:hidden;
      text-overflow:ellipsis;
    }
    .topbar-period-pill.empty .topbar-period-value{
      color:var(--muted);
      font-weight:700;
    }

    /* Pe tab-urile unde perioada nu e relevantă, ascundem pill-ul */
    body.view-clients-active .topbar-period-pill,
    body.view-info-active .topbar-period-pill{
      display:none;
    }

    /* Mobile: pill mai compact */
    @media(max-width:720px){
      .topbar-period-pill{
        max-width:160px;
        padding:6px 10px;
        font-size:11px;
      }
    }

/* Recommendation dashboard adjustments */
#view-dashboard .dash-kpi-primary,
#view-dashboard .dash-kpi-secondary{
  gap:14px;
  margin-bottom:16px;
}

#view-dashboard .dash-kpi-card{
  min-height:96px;
  padding:16px;
}

#view-dashboard .dash-kpi-value{
  font-size:28px;
}

#view-dashboard .dash-section-label{
  margin:16px 0 10px;
}

#view-dashboard .compact-chart-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}

#view-dashboard .compact-chart-card{
  min-height:260px;
}
