/* =========================================================================
 * CARETTA — PREMIUM THEME (rollout app-wide) — 2026-06-30
 * Strat de ARMONIZARE: aliniază modulele existente la limbajul premium al
 * fișei DB Parteneri (bandă brand navy #003349, accent roșu #E0004D,
 * componente ds-*). Additiv, încărcat ULTIMUL → override pe stilurile vechi.
 * Totul pe tokeni din css/variables.css. Modul cu modul, scoped pe view.
 *
 * NU rescrie DOM/logică — doar prezentare. Respectă RBAC (profit/export gate).
 * ========================================================================= */


/* =========================================================================
 * 1. COMMAND CENTER (view-command-center / „Activitate Zilnică")
 * Antetul (cc-hero--header) devine bandă brand navy, ca antetul fișei.
 * ========================================================================= */
#view-command-center .cc-hero--header {
    background: var(--caretta-navy);
    border-radius: 14px;
    padding: 14px 20px;
    align-items: center;
    box-shadow: var(--elev-2);
}
#view-command-center .cc-hero--header .cc-hero-eyebrow { color: rgba(255, 255, 255, 0.62); }
#view-command-center .cc-hero--header .cc-hero-eyebrow i { color: var(--caretta-red); }
#view-command-center .cc-hero--header .cc-hero-title { color: #fff; }
#view-command-center .cc-hero--header .cc-hero-sub { color: rgba(255, 255, 255, 0.72); }

#view-command-center .cc-hero--header .cc-hero-chip {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.22);
    color: #fff;
}
#view-command-center .cc-hero--header .cc-hero-chip i,
#view-command-center .cc-hero--header .cc-hero-chip b { color: #fff; }

#view-command-center .cc-hero--header .cc-ghost-btn {
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.28);
    color: #fff;
}
#view-command-center .cc-hero--header .cc-ghost-btn:hover {
    background: rgba(255, 255, 255, 0.20);
    border-color: rgba(255, 255, 255, 0.42);
}
#view-command-center .cc-hero--header .cc-ghost-btn i { color: #fff; }


/* =========================================================================
 * 2. HEADERE MODULE PARTAJATE → bandă brand navy
 * mkt-hero = Marketing + Expozoare + Juridic · pallets-hero = Evidență Paleți
 * ========================================================================= */
.mkt-hero,
.pallets-hero {
    background: var(--caretta-navy);
    border: none;
    box-shadow: var(--elev-2);
}
.mkt-hero h2,
.pallets-hero h2 { color: #fff; }
.mkt-hero p,
.pallets-hero p { color: rgba(255, 255, 255, 0.74); }
.mkt-hero .section-eyebrow,
.pallets-hero .section-eyebrow { color: rgba(255, 255, 255, 0.66); }
.mkt-hero .section-eyebrow i,
.pallets-hero .section-eyebrow i { color: var(--caretta-red); }

.mkt-hero .mkt-source {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.22);
    color: #fff;
}
.mkt-hero .mkt-export-btn { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); }


/* =========================================================================
 * 3. REPORT VIEWS (header .report-toolbar — ~15 module: Vânzări, Încasări,
 *    Registru, Vizite, Planificator, Zilnic, Oferte, Obiective, Comenzi CRM,
 *    Activitate Utilizatori, Analiză Financiară etc.)
 *    Header-ul devine bandă brand navy (header de card), controale lizibile.
 * ========================================================================= */
.dashboard-view .report-toolbar {
    background: var(--caretta-navy);
    border-radius: 12px;
    padding: 13px 18px;
    margin-bottom: 16px;
    box-shadow: var(--elev-1);
    align-items: center;
}
.dashboard-view .report-toolbar h3 { color: #fff; }
.dashboard-view .report-toolbar p { color: rgba(255, 255, 255, 0.74); }

/* Butoanele de acțiune din header → translucid alb, lizibile pe navy.
   !important fiindcă .secondary-btn forțează color/background cu !important. */
.dashboard-view .report-toolbar .upload-btn,
.dashboard-view .report-toolbar .upload-btn.secondary-btn {
    background: rgba(255, 255, 255, 0.14) !important;
    border: 1px solid rgba(255, 255, 255, 0.30) !important;
    color: #fff !important;
}
.dashboard-view .report-toolbar .upload-btn:hover,
.dashboard-view .report-toolbar .upload-btn.secondary-btn:hover {
    background: rgba(255, 255, 255, 0.24) !important;
    border-color: rgba(255, 255, 255, 0.45) !important;
}
.dashboard-view .report-toolbar .upload-btn i { color: #fff !important; }

/* Plasă de siguranță: orice select/input/search direct în header rămâne lizibil */
.dashboard-view .report-toolbar > select,
.dashboard-view .report-toolbar > input,
.dashboard-view .report-toolbar .report-actions select,
.dashboard-view .report-toolbar .report-actions input {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.28);
    color: #fff;
}
.dashboard-view .report-toolbar select option { color: #1f2937; }


/* =========================================================================
 * 4. DB PARTENERI — LISTĂ (view-crm) — header card → bandă brand navy
 * (header propriu cu h2 inline + Master Sync / Export MACRO / filtru / căutare)
 * ========================================================================= */
.dbp-listing-hero {
    background: var(--caretta-navy) !important;
    border: none !important;
    box-shadow: var(--elev-2);
}
.dbp-listing-hero h2 { color: #fff !important; }
.dbp-listing-hero h2 i { color: var(--caretta-red) !important; }
.dbp-listing-hero .upload-btn.secondary-btn {
    background: rgba(255, 255, 255, 0.14) !important;
    border-color: rgba(255, 255, 255, 0.30) !important;
    color: #fff !important;
}
.dbp-listing-hero .crm-source-filter {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.28);
    color: #fff;
}
.dbp-listing-hero .crm-source-filter option { color: #1f2937; }



/* =========================================================================
 * 5. CORP MODULE — redesign premium (workflow: 9 agenti produce + verify adversarial)
 * Blocuri verificate & corectate: kpi, tables, cards, filters, badges, charts,
 * scadentar, obiective, vizite. Scoped, pe tokeni, dark-mode-safe.
 * ========================================================================= */
/* ===== [kpi] Carduri KPI (app-wide) ===== */
/* ============================================================
   PREMIUM — Carduri KPI (app-wide)
   .kpi-cards / .kpi-card / .kpi-icon / .kpi-info
   Aliniate cu .ds-kpi. Scope pe clasa componentei.
   Tokeni reali din variables.css. Fara !important.
   NOTA: tokenii --bg-surface/--text-strong/--text-soft/
   --border-subtle nu sunt redefiniti in dark-mode -> rulele
   care poarta CULOARE sunt scopate cu body:not(.dark-mode)
   ca dark mode sa-si pastreze tratamentul propriu functional.
   Rulele structurale (radius/elevatie/no-glow) raman globale.
   ============================================================ */

/* --- Card: structura (radius, hover lift) — neutru fata de tema --- */
.kpi-cards .kpi-card,
.kpi-card {
  border-radius: var(--r-md);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}
.kpi-cards .kpi-card:hover,
.kpi-card:hover {
  transform: translateY(-1px);
  box-shadow: var(--elev-2);
}

/* --- Card: surface/border premium — DOAR pe light (tokeni light-only) --- */
body:not(.dark-mode) .kpi-cards .kpi-card,
body:not(.dark-mode) .kpi-card {
  background: var(--bg-surface);
  border: 1px solid var(--border-subtle);
  box-shadow: var(--elev-1);
}
body:not(.dark-mode) .kpi-cards .kpi-card:hover,
body:not(.dark-mode) .kpi-card:hover {
  border-color: var(--border-strong);
}

/* --- Icon: structura flat premium (fara glow, fara scale) — global --- */
.kpi-cards .kpi-icon,
.kpi-card .kpi-icon {
  border-radius: var(--r-md);
  box-shadow: none;
}
.kpi-card:hover .kpi-icon {
  transform: none;
}

/* --- Icon: tint semafor ~12% — DOAR pe light, ca dark sa-si pastreze
       propriile background-uri (body.dark-mode .kpi-icon.blue etc.) --- */
body:not(.dark-mode) .kpi-card .kpi-icon.blue {
  background: color-mix(in srgb, var(--caretta-navy) 12%, var(--bg-surface));
  color: var(--caretta-navy);
}
body:not(.dark-mode) .kpi-card .kpi-icon.green {
  background: color-mix(in srgb, var(--signal-on-track) 12%, var(--bg-surface));
  color: var(--signal-on-track);
}
body:not(.dark-mode) .kpi-card .kpi-icon.orange {
  background: color-mix(in srgb, var(--signal-watch) 12%, var(--bg-surface));
  color: var(--signal-watch);
}
body:not(.dark-mode) .kpi-card .kpi-icon.red {
  background: color-mix(in srgb, var(--signal-action) 12%, var(--bg-surface));
  color: var(--signal-action);
}
body:not(.dark-mode) .kpi-card .kpi-icon.teal {
  background: color-mix(in srgb, var(--signal-info) 12%, var(--bg-surface));
  color: var(--signal-info);
}
/* Nu exista token purple -> pastrez hexul existent (#7c3aed) doar in tint */
body:not(.dark-mode) .kpi-card .kpi-icon.purple {
  background: color-mix(in srgb, #7c3aed 12%, var(--bg-surface));
  color: #7c3aed;
}

/* --- Label: eyebrow uppercase, ton soft — DOAR light (--text-soft light-only) --- */
body:not(.dark-mode) .kpi-card .kpi-info h3 {
  font-size: var(--fs-eyebrow);
  color: var(--text-soft);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
/* Tipografia (non-culoare) e sigura pe ambele teme */
.kpi-card .kpi-info h3 {
  font-size: var(--fs-eyebrow);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* --- Valoarea: typografie globala (sigura), culoare DOAR light --- */
.kpi-card .kpi-info h2 {
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}
body:not(.dark-mode) .kpi-card .kpi-info h2 {
  color: var(--text-strong);
}


/* ===== [tables] Tabele de date (app-wide) ===== */
/* =========================================================================
 * 5. TABELE DE DATE (app-wide) — armonizare CORP tabel cu limbajul .ds-table
 * Tinta: .data-table, #dataTable, #dailyTable, #palletsTable, #visits-table,
 *        #sc-table, #obiectiveTable, #offersTable, #vdb-*-table, #incasari.
 * Lasa NEATINSE: min-width (components.css:313), sticky/z-index, border-spacing,
 * layout/display/width. Doar prezentare (fundal/text/border/hover/zebra).
 * Scope desktop: guard body:not(.dark-mode) pe culori + @media (min-width:769px)
 * ca sa NU patrunda peste tratamentul premium mobil din views.css @media
 * (max-width:768px) (selectorul body:not(.dark-mode) ... are specificitate mai
 * mare (0,2,3) decat regulile mobile (0,1,2) si media query nu adauga
 * specificitate, deci fara guard ar suprascrie mobilul -> regresie). Hover
 * foloseste !important DOAR ca sa bata `rgba(59,130,246,.07) !important` din
 * views.css:2698.
 * ========================================================================= */
@media (min-width: 769px) {

  /* 5a. thead — fundal subtil, etichete uppercase soft (ca .ds-table thead th).
     Pastreaza sticky/top/z-index din regula veche (nu le re-declaram). */
  body:not(.dark-mode) .data-table thead th,
  body:not(.dark-mode) #dataTable thead th,
  body:not(.dark-mode) #dailyTable thead th,
  body:not(.dark-mode) #palletsTable thead th,
  body:not(.dark-mode) #visits-table thead th,
  body:not(.dark-mode) #sc-table thead th,
  body:not(.dark-mode) #obiectiveTable thead th,
  body:not(.dark-mode) #offersTable thead th,
  body:not(.dark-mode) #vdb-actions-table thead th,
  body:not(.dark-mode) #vdb-latest-table thead th,
  body:not(.dark-mode) #vdb-health-table thead th,
  body:not(.dark-mode) #vdb-unvisited-table thead th,
  body:not(.dark-mode) #vdb-new-partners-table thead th,
  body:not(.dark-mode) #incasari-table-head th {
      background: var(--bg-subtle);
      color: var(--text-soft);
      font-size: var(--fs-eyebrow);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      border-bottom: 1px solid var(--border-subtle);
      box-shadow: none;
  }

  /* 5b. tbody — separator orizontal subtil + numere aliniate (tabular-nums). */
  body:not(.dark-mode) .data-table tbody td,
  body:not(.dark-mode) #dataTable tbody td,
  body:not(.dark-mode) #dailyTable tbody td,
  body:not(.dark-mode) #palletsTable tbody td,
  body:not(.dark-mode) #visits-table tbody td,
  body:not(.dark-mode) #sc-table tbody td,
  body:not(.dark-mode) #obiectiveTable tbody td,
  body:not(.dark-mode) #offersTable tbody td,
  body:not(.dark-mode) #vdb-actions-table tbody td,
  body:not(.dark-mode) #vdb-latest-table tbody td,
  body:not(.dark-mode) #vdb-health-table tbody td,
  body:not(.dark-mode) #vdb-unvisited-table tbody td,
  body:not(.dark-mode) #vdb-new-partners-table tbody td {
      border-bottom: 1px solid var(--border-subtle);
      color: var(--text-default);
      font-variant-numeric: tabular-nums;
  }

  /* 5c. zebra — inmuiere de pe rgba(0,0,0,.022) pe un tint subtle abia perceptibil. */
  body:not(.dark-mode) .data-table tbody tr:nth-child(even),
  body:not(.dark-mode) #dataTable tbody tr:nth-child(even),
  body:not(.dark-mode) #sc-table tbody tr:nth-child(even),
  body:not(.dark-mode) #dailyTable tbody tr:nth-child(even),
  body:not(.dark-mode) #obiectiveTable tbody tr:nth-child(even),
  body:not(.dark-mode) #offersTable tbody tr:nth-child(even) {
      background: color-mix(in srgb, var(--bg-subtle) 46%, transparent);
  }

  /* 5d. hover — rebranding de pe albastrul generic pe --bg-surface-hover (pe brand).
     !important OBLIGATORIU: bate `rgba(59,130,246,.07) !important` din
     views.css:2694-2699 (`.data-table tbody tr:hover td` etc.). */
  body:not(.dark-mode) .data-table tbody tr:hover td,
  body:not(.dark-mode) #dataTable tbody tr:hover td,
  body:not(.dark-mode) #sc-table tbody tr:hover td,
  body:not(.dark-mode) #dailyTable tbody tr:hover td,
  body:not(.dark-mode) #obiectiveTable tbody tr:hover td,
  body:not(.dark-mode) #offersTable tbody tr:hover td,
  body:not(.dark-mode) #palletsTable tbody tr:hover td,
  body:not(.dark-mode) #visits-table tbody tr:hover td,
  body:not(.dark-mode) #vdb-actions-table tbody tr:hover td,
  body:not(.dark-mode) #vdb-latest-table tbody tr:hover td,
  body:not(.dark-mode) #vdb-health-table tbody tr:hover td {
      background: var(--bg-surface-hover) !important;
  }

}


/* ===== [cards] Carduri continut + titluri sectiune ===== */
/* =========================================================================
 * 5. CARDURI CONȚINUT + TITLURI SECȚIUNE (corpul modulelor, NU antetele)
 * Armonizează cardurile de conținut la limbajul premium: radius 12px,
 * border --border-subtle, --elev-1 (hover --elev-2), titluri h3 --text-strong
 * cu iconiță accent roșu. Doar proprietăți universal-sigure (radius/border/
 * elev/spacing/culoare text) — NU display/layout/width. Exclud cardurile
 * bespoke Command Center (.cc-*) și KPI (.kpi-card), care au accente proprii.
 * ========================================================================= */

/* 5.1 — Carcasa cardului de conținut: radius 12px + border subtil + elevație 1.
   Acoperă atât .card de bază (legacy --radius-lg 16px + border alb invizibil),
   cât și .dashboard-view .card (deja --r-md 10px → urcat la 12px pt consistență).
   NU ating .cc-* (Command Center, borduri/accente proprii) și nici .kpi-card. */
.dashboard-view .card:not([class*="cc-"]):not(.kpi-card):not(.mkt-hero):not(.pallets-hero):not(.dbp-listing-hero),
.admin-panel .card:not([class*="cc-"]):not(.kpi-card) {
    border-radius: 12px;
    border: 1px solid var(--border-subtle);
    box-shadow: var(--elev-1);
}

/* Hover discret (elevație 2) — fără salt de poziție, premium static.
   .card.chart-container are deja hover propriu în premium.css (lift -2px); îl
   lăsăm pe acela, aici doar ridicăm umbra cardurilor de conținut non-chart. */
.dashboard-view .card:not([class*="cc-"]):not(.kpi-card):not(.chart-container):not(.mkt-hero):not(.pallets-hero):not(.dbp-listing-hero):hover {
    box-shadow: var(--elev-2);
}

/* 5.2 — Titlul de secțiune din card (h3). Culoare fermă + greutate consistentă.
   Scoping pe descendent h3 al cardului de conținut; exclud KPI (.kpi-info h3
   are propriul tratament uppercase/muted) și cardurile cc-*. */
.dashboard-view .card:not([class*="cc-"]) > h3,
.dashboard-view .card:not([class*="cc-"]) .card-title,
.admin-panel .card:not([class*="cc-"]) > h3 {
    color: var(--text-strong);
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.25;
    font-variant-numeric: tabular-nums;
}

/* 5.3 — Iconița din titlul de secțiune → accent roșu Caretta.
   Afectează DOAR h3-uri care chiar conțin un <i> (titlurile chart fără icon
   rămân neatinse). Exclud cc-* (au iconițe colorate semantic propriu). */
.dashboard-view .card:not([class*="cc-"]) > h3 > i,
.dashboard-view .card:not([class*="cc-"]) .card-title > i,
.admin-panel .card:not([class*="cc-"]) > h3 > i {
    color: var(--caretta-red);
    margin-right: 6px;
}

/* 5.4 — Separator sub titlu (când există) coerent cu --border-subtle.
   Doar pentru h3-uri cu clasa explicită .card-title--rule (opt-in), nu forțez
   pe inline-styles existente. Sigur: nu există clasă în uz care să se rupă. */
.dashboard-view .card:not([class*="cc-"]) > h3.card-title--rule {
    border-bottom: 1px solid var(--border-subtle);
    padding-bottom: var(--sp-3);
    margin-bottom: var(--sp-4);
}

/* 5.5 — Dark mode: pe fundal închis, titlul rămâne lizibil (alb-spălat), iconița
   păstrează accentul roșu. Bat tonul --text-strong (foarte închis) pe dark. */
body.dark-mode .dashboard-view .card:not([class*="cc-"]) > h3,
body.dark-mode .admin-panel .card:not([class*="cc-"]) > h3 {
    color: #eaf1f6;
}


/* ===== [filters] Filtre / cautare / slicere ===== */
/* ============================================================
   PREMIUM HARMONIZARE — Filtre / Căutare / Slicere
   (search-box, slicer-btn, scroll-slicer, panou filtre CRM, chips)
   Scop: stil unitar pe tokeni reali; păstrează funcționalitatea.
   ============================================================ */

/* ---- 1. Search box: input curat + lupă pe tonul corect ---- */
.search-box i {
    color: var(--text-faint);
    font-size: 0.85rem;
    transition: color 0.15s ease;
}
.search-box input {
    background-color: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    color: var(--text-default);
    border-radius: var(--r-md);
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}
.search-box input::placeholder {
    color: var(--text-faint);
}
.search-box input:hover {
    border-color: var(--border-strong);
}
.search-box input:focus {
    border-color: var(--caretta-navy);
    box-shadow: 0 0 0 3px var(--caretta-navy-50);
}
/* când inputul e focusat, lupa preia accentul navy */
.search-box:focus-within i {
    color: var(--caretta-navy);
}

/* ---- 2. Slicer buttons: pill premium, activ navy — pe TOATE view-urile ---- */
.slicer-btn {
    background-color: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    color: var(--text-default);
    border-radius: var(--r-pill);
    font-weight: 600;
    transition: background-color 0.15s ease, border-color 0.15s ease,
                color 0.15s ease, box-shadow 0.15s ease;
}
.slicer-btn:hover {
    border-color: var(--caretta-navy);
    background-color: var(--caretta-navy-50);
    color: var(--caretta-navy);
}
.slicer-btn.active {
    background-color: var(--caretta-navy);
    border-color: var(--caretta-navy);
    color: #fff;
    box-shadow: var(--elev-1);
}
.slicer-btn.active:hover {
    background-color: var(--caretta-navy-deep);
    border-color: var(--caretta-navy-deep);
    color: #fff;
}

/* ---- 3. Etichete de grup (label) — eyebrow consistent ---- */
.slicer-group label {
    color: var(--text-soft);
    letter-spacing: 0.05em;
}

/* ---- 4. Scrollbar subțire unificat pe containerele de slicere/chips ---- */
.scroll-slicer::-webkit-scrollbar,
.crm-fg-chips::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
.scroll-slicer::-webkit-scrollbar-track,
.crm-fg-chips::-webkit-scrollbar-track {
    background: var(--bg-subtle);
    border-radius: var(--r-pill);
}
.scroll-slicer::-webkit-scrollbar-thumb,
.crm-fg-chips::-webkit-scrollbar-thumb {
    background: var(--border-strong);
    border-radius: var(--r-pill);
}
.scroll-slicer::-webkit-scrollbar-thumb:hover,
.crm-fg-chips::-webkit-scrollbar-thumb:hover {
    background: var(--text-faint);
}

/* ---- 5. Panou filtre CRM — card pe tokeni reali ---- */
.crm-filter-panel {
    border: 1px solid var(--border-subtle);
    border-radius: var(--r-lg);
    box-shadow: var(--elev-1);
}
.crm-fp-head {
    border-bottom: 1px solid var(--border-subtle);
}
.crm-fp-title {
    color: var(--text-strong);
}
.crm-fp-title i {
    color: var(--signal-info);
}
.crm-fg-label,
.crm-fp-group {
    color: var(--text-soft);
}
/* badge stare filtru: neutru curat / activ navy */
.crm-fp-badge {
    color: var(--text-soft);
    background: var(--bg-subtle);
    border: 1px solid var(--border-subtle);
    border-radius: var(--r-pill);
}
.crm-fp-badge.on {
    color: #fff;
    background: var(--caretta-navy);
    border-color: var(--caretta-navy);
}
/* select-urile din panou — aliniere vizuală cu search box */
.crm-fp-group select {
    border-radius: var(--r-sm);
    border: 1px solid var(--border-subtle);
    background: var(--bg-surface);
    color: var(--text-default);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.crm-fp-group select:hover {
    border-color: var(--border-strong);
}
.crm-fp-group select:focus {
    outline: none;
    border-color: var(--caretta-navy);
    box-shadow: 0 0 0 3px var(--caretta-navy-50);
}

/* ---- 6. Chips de filtru (în panoul CRM) — pill, activ navy ----
   IMPORTANT: excludem dimensiunea "clasificare" (PLATINUM/GOLD/SILVER/BRONZE),
   care are culori de tier proprii definite in premium.css. Fara aceasta gardare,
   regula ID-scoped de mai jos (specificitate cu ID, incarcata ultima) ar bate
   culorile de tier si le-ar uniformiza la navy. */
#crm-filter-panel .crm-fg-chips:not([data-dim="clasificare"]) .slicer-btn {
    border-radius: var(--r-pill);
    border: 1px solid var(--border-subtle);
    background: var(--bg-surface);
    color: var(--text-soft);
    font-weight: 600;
}
#crm-filter-panel .crm-fg-chips:not([data-dim="clasificare"]) .slicer-btn:hover {
    border-color: var(--caretta-navy);
    background: var(--caretta-navy-50);
    color: var(--caretta-navy);
}
#crm-filter-panel .crm-fg-chips:not([data-dim="clasificare"]) .slicer-btn.active {
    background: var(--caretta-navy);
    border-color: var(--caretta-navy);
    color: #fff;
}


/* ===== [badges] Badge-uri status / trend (app-wide) ===== */
/* =========================================================================
 * 5. BADGE-URI STATUS / TREND (app-wide) → limbaj .ds-badge unificat
 * Toate familiile de pastile semafor din module foloseau verde/ambra/rosu
 * usor diferite (ex. verde #059669/#047857/#15803d, galben #d97706/#b45309,
 * rosu #dc2626/#ef4444/#b91c1c). Le aliniez la EXACT cei 3 tokeni de semafor
 * (--signal-on-track / --signal-watch / --signal-action), forma --r-pill si
 * tipografia --fs-small bold tabular. NU schimb semantica/layout/display/RBAC.
 *
 * CONTRAST: FUNDALUL sta pe tokenul PUR de semafor (cele 3 tinte raman
 * identice intre ecrane), dar TEXTUL e intunecat prin color-mix cu
 * --text-strong, ca sa treaca WCAG AA (tokenii bruti #f59e0b/#10b981/#0ea5e9
 * ca text pe alb sunt prea deschisi). Tot tokeni reali, color-mix deja folosit.
 * ========================================================================= */

/* 5.1 Forma + tipar comun pentru pastilele de status/trend.
   Doar proprietati universal-sigure (radius/font/numere), fara display/width.
   .crm-source-badge NU e inclus aici: are tipografia proprie tunata
   (0.68rem / 950 / uppercase) — ii unificam doar culoarea (5.5/5.6). */
.visit-risk-pill,
.vdb-status-pill,
.vdb-priority-pill,
.vdb-signal-pill,
.ai-status-ok, .ai-status-info, .ai-status-warn, .ai-status-risk, .ai-status-critical,
.cc-kpi-global-badge {
    border-radius: var(--r-pill);
    font-size: var(--fs-small);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
}

/* 5.2 SEMAFOR VERDE — „pe drum / OK / indeplinit" → --signal-on-track.
   Fundal translucid pe token; text intunecat pe acelasi hue (AA). */
.visit-risk-pill.risk-ok,
.visit-risk-pill.location-ok,
.vdb-status-verde,
.vdb-signal-pill.ok,
.ai-status-ok {
    background: color-mix(in srgb, var(--signal-on-track) 14%, transparent);
    color: color-mix(in srgb, var(--signal-on-track) 55%, var(--text-strong));
    border-color: color-mix(in srgb, var(--signal-on-track) 30%, transparent);
}

/* 5.3 SEMAFOR GALBEN/AMBRA — „de urmarit / aproape" → --signal-watch. */
.visit-risk-pill.risk-watch,
.visit-risk-pill.location-warn,
.visit-location-status.location-warn,
.vdb-status-galben,
.vdb-priority-medie,
.ai-status-warn {
    background: color-mix(in srgb, var(--signal-watch) 16%, transparent);
    color: color-mix(in srgb, var(--signal-watch) 48%, var(--text-strong));
    border-color: color-mix(in srgb, var(--signal-watch) 32%, transparent);
}

/* 5.4 SEMAFOR ROSU — „de actionat / critic / restant" → --signal-action. */
.visit-risk-pill.risk-critical,
.visit-risk-pill.location-danger,
.visit-location-status.location-danger,
.vdb-status-rosu,
.vdb-priority-critica,
.vdb-signal-pill.critica,
.vdb-signal-pill.mare,
.ai-status-critical {
    background: color-mix(in srgb, var(--signal-action) 15%, transparent);
    color: color-mix(in srgb, var(--signal-action) 60%, var(--text-strong));
    border-color: color-mix(in srgb, var(--signal-action) 30%, transparent);
}

/* 5.5 INFO/ALBASTRU — „informativ / sursa CRM / risc moderat" → --signal-info.
   (prioritate „mica", status AI info, badge sursa CRM) */
.vdb-priority-mica,
.ai-status-info,
.crm-source-badge.crm {
    background: color-mix(in srgb, var(--signal-info) 14%, transparent);
    color: color-mix(in srgb, var(--signal-info) 55%, var(--text-strong));
    border-color: color-mix(in srgb, var(--signal-info) 30%, transparent);
}
.ai-status-risk {
    background: color-mix(in srgb, var(--signal-action) 12%, transparent);
    color: color-mix(in srgb, var(--signal-action) 60%, var(--text-strong));
    border-color: color-mix(in srgb, var(--signal-action) 26%, transparent);
}
/* „mare" la prioritati = treapta intre galben si rosu → ramane pe rosu-semafor
   ca sa nu introducem o a 4-a culoare; aliniat cu critica de mai sus. */
.vdb-priority-mare {
    background: color-mix(in srgb, var(--signal-action) 13%, transparent);
    color: color-mix(in srgb, var(--signal-action) 60%, var(--text-strong));
}

/* 5.6 Badge sursa „prospect" → verde-semafor (era #047857) */
.crm-source-badge.prospect {
    background: color-mix(in srgb, var(--signal-on-track) 14%, transparent);
    color: color-mix(in srgb, var(--signal-on-track) 55%, var(--text-strong));
}

/* 5.7 KPI Command Center — pastilele de verdict global la acelasi semafor.
   Bate fundalurile hardcodate rgba(..) din views.css (specificitate egala,
   incarcat ultimul). .val pastreaza textul de semafor (AA). */
.cc-kpi-global-badge.indeplinit { background: color-mix(in srgb, var(--signal-on-track) 14%, transparent); }
.cc-kpi-global-badge.indeplinit .val { color: color-mix(in srgb, var(--signal-on-track) 55%, var(--text-strong)); }
.cc-kpi-global-badge.aproape { background: color-mix(in srgb, var(--signal-watch) 16%, transparent); }
.cc-kpi-global-badge.aproape .val { color: color-mix(in srgb, var(--signal-watch) 48%, var(--text-strong)); }
.cc-kpi-global-badge.sub_target { background: color-mix(in srgb, var(--signal-action) 12%, transparent); }
.cc-kpi-global-badge.sub_target .val { color: color-mix(in srgb, var(--signal-action) 60%, var(--text-strong)); }
.cc-kpi-global-badge.fara_date,
.cc-kpi-global-badge.target_invalid { background: var(--bg-subtle); }
.cc-kpi-global-badge.fara_date .val,
.cc-kpi-global-badge.target_invalid .val { color: var(--text-soft); }

/* Proiectie KPI in textul cardurilor (sageti/cifre) la acelasi semafor.
   (deja identic in views.css:1415-1417 — pastrat defensiv, no-op) */
.cc-kpi-proj.indeplinit { color: var(--signal-on-track); }
.cc-kpi-proj.aproape    { color: var(--signal-watch); }
.cc-kpi-proj.sub_target { color: var(--signal-action); }

/* 5.8 TREND sus/jos — armonizat cu .ds-badge--up/--down (verde sus / rosu jos),
   pe tokeni de semafor in loc de hex izolate (din design-system.css).
   Text intunecat pt AA; fundal pe tokenul pur. */
.ds-badge--up,
.trend-up {
    background: color-mix(in srgb, var(--signal-on-track) 12%, transparent);
    color: color-mix(in srgb, var(--signal-on-track) 55%, var(--text-strong));
}
.ds-badge--down,
.trend-down {
    background: color-mix(in srgb, var(--signal-action) 12%, transparent);
    color: color-mix(in srgb, var(--signal-action) 60%, var(--text-strong));
}
.ds-badge--watch {
    background: color-mix(in srgb, var(--signal-watch) 14%, transparent);
    color: color-mix(in srgb, var(--signal-watch) 48%, var(--text-strong));
}


/* ===== [charts] Containere grafice ===== */
/* =========================================================================
 * 5. CONTAINERE GRAFICE (.chart-container / .card chart / titluri / canvas)
 * Armonizare app-wide a cardurilor de grafic la limbajul premium:
 *   - suprafata curata (--bg-surface) + border --border-subtle + radius 12px
 *   - elevatie discreta --elev-1, hover --elev-2 (consistent cu ds-card)
 *   - titlu h3 = --text-strong, greutate 700, cu accent eyebrow rosu (bara)
 *   - canvas fluid (NU atingem Chart.js sau inaltimile existente)
 * Scoped STRICT pe .chart-container -> nu atinge .card de baza / alte ecrane.
 * Heights / layout / display NU sunt modificate (au !important fragile in cod).
 * ========================================================================= */

/* --- Card de grafic: chrome premium unificat ------------------------------ */
.chart-container.card {
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    border-radius: 12px;
    box-shadow: var(--elev-1);
    transition: box-shadow 0.18s ease, border-color 0.18s ease;
}
.chart-container.card:hover {
    box-shadow: var(--elev-2);
    border-color: var(--border-strong);
}

/* Varianta fara .card explicit (rare, dar exista) primeste acelasi chrome */
.chart-container:not(.card) {
    border-radius: 12px;
}

/* --- Titlul graficului: ierarhie premium + accent eyebrow ----------------- */
.chart-container > h3,
.chart-container.card > h3 {
    color: var(--text-strong);
    font-weight: 700;
    font-size: var(--fs-h3);
    line-height: 1.25;
    letter-spacing: 0.01em;
    display: flex;
    align-items: center;
    gap: var(--sp-1);
}
/* Bara-accent rosie (eyebrow) inaintea titlului — semnatura premium Caretta.
   Pe inline-icon (i) deja prezent in unele titluri nu interfereaza: e doar
   un pseudo-element decorativ inaintea continutului. */
.chart-container > h3::before,
.chart-container.card > h3::before {
    content: "";
    flex: 0 0 auto;
    width: 3px;
    height: 0.95em;
    border-radius: var(--r-pill);
    background: var(--caretta-red);
}

/* --- Canvas: ramane fluid, fara filtre/umbre agresive in card ------------- */
.chart-container.card canvas {
    display: block;
    width: 100% !important;
    filter: none;
}

/* --- Legende custom (acolo unde sunt randate ca DOM, nu de Chart.js) ------ */
.chart-container .chart-legend,
.chart-container .legend-row {
    color: var(--text-soft);
    font-size: var(--fs-small);
}

/* --- Dark-mode: card de grafic coerent cu suprafetele navy ---------------- */
body.dark-mode .chart-container.card {
    background: #0f1b24;
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: var(--elev-1);
}
body.dark-mode .chart-container.card:hover {
    border-color: rgba(255, 255, 255, 0.16);
}
body.dark-mode .chart-container > h3,
body.dark-mode .chart-container.card > h3 {
    color: #f1f5f9;
}

/* --- Print: chrome plat, fara umbra (consecvent cu .card @media print) ----- */
@media print {
    .chart-container.card {
        box-shadow: none;
        border: 1px solid var(--border-subtle);
    }
    .chart-container > h3::before,
    .chart-container.card > h3::before {
        background: var(--caretta-navy);
    }
}


/* ===== [scadentar] Body Scadentar ===== */
/* =========================================================================
 * 5. SCADENȚAR — CORP (#view-scadentar)
 * Antetul navy e deja tratat de secțiunea 3 (.dashboard-view .report-toolbar).
 * Aici premiumizăm DOAR corpul: KPI de risc cu semafor, plan de colectare,
 * carduri chart/registru, buckets & pastile de risc.
 *
 * FIX IMPORTANT: în corp există DOUĂ .report-toolbar NESTED (sub-anteturi de
 * card: planul de colectare + Registrul Creanțelor) care, fiind sub
 * .dashboard-view, prind banda navy globală din secțiunea 3. NU sunt anteturi
 * de modul → le readucem pe suprafață albă, cu text și inputs lizibile.
 * (Antetul real al modulului e primul .report-toolbar, copil direct al view-ului;
 *  îl lăsăm navy.)
 * ========================================================================= */

/* ---- 5.1 KPI-uri de risc (#sc-kpi-row) — carduri curate + bandă semafor ---- */
#view-scadentar #sc-kpi-row {
    gap: var(--sp-4);
}
#view-scadentar #sc-kpi-row .kpi-card {
    border: 1px solid var(--border-subtle);
    border-left: 3px solid var(--border-strong);
    border-radius: var(--r-lg);
    box-shadow: var(--elev-1);
    padding: var(--sp-4) var(--sp-5);
    background: var(--bg-surface);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}
#view-scadentar #sc-kpi-row .kpi-card:hover {
    box-shadow: var(--elev-2);
    transform: translateY(-2px);
}
/* Muchie-semafor per card, în ordinea din DOM:
   1=expunere(info) · 2=în termen(verde) · 3=restanțe(galben) · 4=critic(roșu) */
#view-scadentar #sc-kpi-row .kpi-card:nth-child(1) { border-left-color: var(--signal-info); }
#view-scadentar #sc-kpi-row .kpi-card:nth-child(2) { border-left-color: var(--signal-on-track); }
#view-scadentar #sc-kpi-row .kpi-card:nth-child(3) { border-left-color: var(--signal-watch); }
#view-scadentar #sc-kpi-row .kpi-card:nth-child(4) { border-left-color: var(--signal-action); }

#view-scadentar #sc-kpi-row .kpi-icon {
    border-radius: var(--r-md);
    box-shadow: none;
}
#view-scadentar #sc-kpi-row .kpi-info h3 {
    color: var(--text-soft);
    letter-spacing: 0.05em;
}
#view-scadentar #sc-kpi-row .kpi-info h2 {
    color: var(--text-strong);
    letter-spacing: -0.02em;
}

/* ---- 5.2 Carduri de conținut (action board, chart, registru) — premium ---- */
#view-scadentar .sc-action-board,
#view-scadentar .charts-row .chart-container,
#view-scadentar .sc-register-card {
    border: 1px solid var(--border-subtle);
    border-radius: var(--r-lg);
    box-shadow: var(--elev-1);
    background: var(--bg-surface);
}
#view-scadentar .charts-row .chart-container > h3 {
    color: var(--text-strong);
    font-weight: 700;
}

/* ---- 5.3 FIX contrast: toolbar-urile NESTED din corp NU sunt anteturi navy ----
   Le readucem pe suprafață, batem banda navy setată în secțiunea 3.
   .sc-action-toolbar = sub-antet al planului de colectare
   .sc-register-card .report-toolbar = sub-antet al Registrului Creanțelor */
#view-scadentar .sc-action-toolbar,
#view-scadentar .sc-register-card .report-toolbar {
    background: transparent;
    border-radius: 0;
    padding: 0;
    margin-bottom: var(--sp-3);
    box-shadow: none;
}
#view-scadentar .sc-action-toolbar h3,
#view-scadentar .sc-register-card .report-toolbar h3 {
    color: var(--text-strong);
}
#view-scadentar .sc-action-toolbar p,
#view-scadentar .sc-register-card .report-toolbar p {
    color: var(--text-soft);
}
/* iconițele de accent revin la roșul de business (pe alb, nu pe navy) */
#view-scadentar .sc-action-toolbar h3 i { color: var(--caretta-red); }
#view-scadentar .sc-register-card .report-toolbar h3 i { color: var(--caretta-red); }

/* Inputs din toolbar-ul registrului: secțiunea 3 le-a făcut albe-translucid
   (lizibile pe navy). Pe card alb → le readucem la inputs normale. */
#view-scadentar .sc-register-card .report-toolbar > select,
#view-scadentar .sc-register-card .report-toolbar > input,
#view-scadentar .sc-register-card .report-toolbar .report-search input {
    background: var(--bg-surface);
    border: 1px solid var(--border-strong);
    border-radius: var(--r-md);
    color: var(--text-default);
}
#view-scadentar .sc-register-card .report-toolbar > select:focus,
#view-scadentar .sc-register-card .report-toolbar .report-search input:focus {
    outline: none;
    border-color: var(--caretta-navy);
    box-shadow: 0 0 0 3px rgba(0, 51, 73, 0.10);
}
#view-scadentar .sc-register-card .report-search i { color: var(--text-faint); }

/* ---- 5.4 Plan de colectare — strip de stat-uri + lane-uri cu semafor ---- */
#view-scadentar .sc-action-stats span {
    border: 1px solid var(--border-subtle);
    border-radius: var(--r-md);
    background: var(--bg-subtle);
}
#view-scadentar .sc-action-stats small { color: var(--text-soft); }
#view-scadentar .sc-action-stats strong { color: var(--text-strong); }

#view-scadentar .sc-action-lane {
    border: 1px solid var(--border-subtle);
    border-top: 3px solid var(--border-strong);
    border-radius: var(--r-md);
    background: var(--bg-surface);
}
#view-scadentar .sc-lane-urgent  { border-top-color: var(--signal-action); }
#view-scadentar .sc-lane-week     { border-top-color: var(--signal-watch); }
#view-scadentar .sc-lane-monitor  { border-top-color: var(--signal-info); }
#view-scadentar .sc-lane-head span { color: var(--text-strong); }
#view-scadentar .sc-lane-head small { color: var(--text-soft); }

#view-scadentar .sc-action-item {
    border: 1px solid var(--border-subtle);
    border-radius: var(--r-md);
    background: var(--bg-surface);
    box-shadow: var(--elev-1);
}
#view-scadentar .sc-action-item.sc-risk-critical { border-left: 3px solid var(--signal-action); }
#view-scadentar .sc-action-item.sc-risk-medium   { border-left: 3px solid var(--signal-watch); }
#view-scadentar .sc-action-item.sc-risk-low      { border-left: 3px solid var(--signal-info); }
#view-scadentar .sc-action-main strong { color: var(--text-strong); }
#view-scadentar .sc-action-main small  { color: var(--text-soft); }
#view-scadentar .sc-action-values span {
    background: var(--bg-subtle);
    border-radius: var(--r-sm);
}
#view-scadentar .sc-action-values small { color: var(--text-soft); }
#view-scadentar .sc-action-values b      { color: var(--text-strong); }
#view-scadentar .sc-action-empty {
    border: 1px dashed var(--border-subtle);
    border-radius: var(--r-md);
    color: var(--text-soft);
}

/* ---- 5.5 Pastile de risc (semafor) ---- */
#view-scadentar .sc-risk-badge {
    border-radius: var(--r-pill);
    letter-spacing: 0.02em;
}
#view-scadentar .sc-risk-badge.sc-risk-critical { background: var(--signal-action); }
#view-scadentar .sc-risk-badge.sc-risk-medium   { background: var(--signal-watch); }
#view-scadentar .sc-risk-badge.sc-risk-low       { background: var(--signal-info); }
#view-scadentar .sc-risk-badge.sc-risk-ok        { background: var(--signal-on-track); }

/* ---- 5.6 Registrul Creanțelor — tabel curat cu thead sticky pe surface ---- */
#view-scadentar #sc-table thead th {
    background: var(--bg-subtle);
    color: var(--text-soft);
    font-size: var(--fs-eyebrow);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-bottom: 1px solid var(--border-subtle);
    box-shadow: 0 1px 0 var(--border-subtle);
}
#view-scadentar #sc-table tbody td { color: var(--text-default); }


/* ===== [obiective] Body Obiective ===== */
/* =========================================================================
 * 5. OBIECTIVE — BODY (#view-obiective)
 * Corpul modulului „Obiective 2026": target vs realizat, gauges/progres,
 * ecart, KPI-uri (kpi-o-*) + registru clase. Antetul registrului ramane
 * banda navy din sectiunea 3 (.report-toolbar) — NU il re-tematizam.
 * Pastram culorile de semafor inline (verde/rosu) puse de app.js; aici doar
 * armonizam suprafetele, numeralele si starile. Tokeni reali din variables.css.
 * ========================================================================= */

/* ---- KPI cards: margine-accent stanga + numerale stabile ---------------- */
#view-obiective .kpi-cards {
    margin-bottom: var(--sp-4);
}
#view-obiective .kpi-card {
    position: relative;
    border-left: 3px solid var(--border-subtle);
    overflow: hidden;
}
/* Tinta asumata + Realizat curent = ancorate pe brand navy */
#view-obiective .kpi-cards .kpi-card:nth-child(1),
#view-obiective .kpi-cards .kpi-card:nth-child(2) {
    border-left-color: var(--caretta-navy);
}
/* Grad Indeplinire & Ecart: culoarea de stare urmeaza .kpi-icon (green/red
   togglat de app.js) — verde = on-track, rosu = action */
#view-obiective #card-o-procent:has(.kpi-icon.green),
#view-obiective #card-o-ecart:has(.kpi-icon.green) {
    border-left-color: var(--signal-on-track);
}
#view-obiective #card-o-procent:has(.kpi-icon.red),
#view-obiective #card-o-ecart:has(.kpi-icon.red) {
    border-left-color: var(--signal-action);
}

/* Eticheta (h3) si valoarea (h2) — ierarhie premium, cifre tabulare */
#view-obiective .kpi-info h3 {
    color: var(--text-soft);
}
#view-obiective .kpi-info h2 {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    line-height: 1.1;
}

/* Sublinia „de recuperat" (#kpi-o-derecuperat) → chip discret pe subtle */
#view-obiective #kpi-o-derecuperat {
    display: inline-flex;
    align-items: center;
    margin-top: var(--sp-1);
    padding: 2px 8px;
    border-radius: var(--r-pill);
    background: var(--bg-subtle);
    border: 1px solid var(--border-subtle);
    color: var(--text-soft) !important;
    line-height: 1.4;
    white-space: nowrap;
}

/* ---- Carduri grafic: suprafata curata + linie-accent navy sus ---------- */
#view-obiective .charts-row { gap: var(--sp-3); }
#view-obiective .chart-container.card {
    position: relative;
    background: var(--bg-surface);
    border: 1px solid var(--border-subtle);
    box-shadow: var(--elev-1);
    border-radius: var(--r-md);
    padding-top: calc(1.1rem + 3px);
}
#view-obiective .chart-container.card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: var(--caretta-navy);
    border-radius: var(--r-md) var(--r-md) 0 0;
}
#view-obiective .chart-container h3 {
    color: var(--text-strong);
    font-weight: 700;
    letter-spacing: -0.01em;
}

/* ---- Registru obiective: corp tabel premium ----------------------------- */
#view-obiective .table-container.card {
    border: 1px solid var(--border-subtle);
    box-shadow: var(--elev-1);
    border-radius: var(--r-md);
}
#view-obiective #obiectiveTable {
    border-collapse: separate;
    border-spacing: 0;
}
/* Cap de tabel: tenta navy translucida, lizibil, sticky (mostenit) */
#view-obiective #obiectiveTable thead th {
    background: var(--caretta-navy-50);
    color: var(--caretta-navy-deep);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--border-strong);
}
/* Randuri: zebra discreta + hover navy-tint */
#view-obiective #obiectiveTable tbody tr:nth-child(even) td {
    background: var(--bg-surface-hover);
}
#view-obiective #obiectiveTable tbody tr:hover td {
    background: var(--caretta-navy-50);
}
#view-obiective #obiectiveTable tbody td {
    border-bottom: 1px solid var(--border-subtle);
    vertical-align: middle;
}
/* Coloana clasa: nume puternic, lizibil */
#view-obiective #obiectiveTable tbody td:first-child strong {
    color: var(--text-strong);
}
/* Coloane numerice: cifre tabulare → numerele se aliniaza pe verticala */
#view-obiective #obiectiveTable td.text-right,
#view-obiective #obiectiveTable th.text-right {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
}
/* Pastila de indeplinire (% — fundal de semafor pus inline de app.js):
   o rotunjim pe token-pill, fara sa-i atingem culoarea/contrastul alb */
#view-obiective #obiectiveTable td:last-child span {
    border-radius: var(--r-pill) !important;
    letter-spacing: 0.01em;
    font-variant-numeric: tabular-nums;
    box-shadow: var(--elev-1);
}


/* ===== [vizite] Body Vizite + Planificator ===== */
/* =========================================================================
 * 5. BODY VIZITE (#view-visits) + PLANIFICATOR (#view-visit-planner)
 *    Antetul navy e deja pus (sectiunea 3 .report-toolbar). Aici lucram pe
 *    CORP: KPI cards, tabelul de vizite, pastile semafor, stops planificator.
 *    Doar prezentare, scoped pe cele 2 view-uri.
 *
 *    NOTA REVIEWER: regulile pt .vplan-day-card (corp), .vplan-day-card::before
 *    si .vplan-day-controlbar din propunere au fost ELIMINATE: views.css le
 *    fixeaza deja cu !important la specificitate egala (linii 10177/10193/10265),
 *    iar ::before e display:none!important -> override-ul fara !important era CSS
 *    MORT. Idem border/bg pe .vplan-partner-row (randurile reale sunt
 *    .vplan-partner-row.vplan-partner-card, id+2 clase + !important). Pastram
 *    doar ce se aplica efectiv (stops, culori text, restul sectiunilor).
 * ========================================================================= */

/* ---- 5.1 KPI cards (Vizite + Planificator mostenesc kpi-card) ---------- */
#view-visits .kpi-cards .kpi-card,
#view-visit-planner .vplan-kpi-grid .kpi-card {
    border: 1px solid var(--border-subtle);
    border-radius: var(--r-lg);
    box-shadow: var(--elev-1);
    transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}
#view-visits .kpi-cards .kpi-card:hover,
#view-visit-planner .vplan-kpi-grid .kpi-card:hover {
    box-shadow: var(--elev-3);
    border-color: color-mix(in srgb, var(--caretta-navy) 26%, var(--border-subtle));
    transform: translateY(-2px);
}
/* Pastila iconitei -> semafor business consistent (icon ramane alb din baza) */
#view-visits .kpi-cards .kpi-icon.blue,
#view-visit-planner .vplan-kpi-grid .kpi-icon.blue { background: var(--caretta-navy); }
#view-visits .kpi-cards .kpi-icon.green,
#view-visit-planner .vplan-kpi-grid .kpi-icon.green { background: var(--signal-on-track); }
#view-visits .kpi-cards .kpi-icon.orange,
#view-visit-planner .vplan-kpi-grid .kpi-icon.orange { background: var(--signal-watch); }
#view-visits .kpi-cards .kpi-icon.red,
#view-visit-planner .vplan-kpi-grid .kpi-icon.red { background: var(--signal-action); }
#view-visits .kpi-cards .kpi-info h3,
#view-visit-planner .vplan-kpi-grid .kpi-info h3 {
    color: var(--text-soft);
    text-transform: uppercase;
    letter-spacing: .03em;
    font-size: var(--fs-eyebrow);
    font-weight: 800;
}

/* ---- 5.2 Tabel Vizite (#visitsTable) — antet + randuri premium -------- */
#view-visits #visitsTable {
    border-collapse: separate;
    border-spacing: 0;
}
#view-visits #visitsTable thead th {
    background: var(--caretta-navy-50);
    color: var(--caretta-navy-deep);
    text-transform: uppercase;
    letter-spacing: .03em;
    font-size: var(--fs-eyebrow);
    font-weight: 800;
    border-bottom: 1px solid var(--border-subtle);
    white-space: nowrap;
}
#view-visits #visitsTable tbody tr {
    transition: background .14s ease, box-shadow .14s ease;
}
#view-visits #visitsTable tbody tr:nth-child(even) {
    background: var(--bg-surface-hover);
}
#view-visits #visitsTable tbody tr:hover {
    background: color-mix(in srgb, var(--caretta-navy) 5%, var(--bg-surface));
    box-shadow: inset 3px 0 0 0 var(--caretta-navy);
}
#view-visits #visitsTable tbody td {
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text-default);
}

/* Butoanele de actiune din rand -> ghost navy curat */
#view-visits .visit-row-actions .icon-btn,
#view-visits .visit-row-actions .upload-btn {
    border-radius: var(--r-sm);
    border: 1px solid var(--border-subtle);
    color: var(--caretta-navy);
    background: var(--bg-surface);
}
#view-visits .visit-row-actions .icon-btn:hover:not(:disabled),
#view-visits .visit-row-actions .upload-btn:hover:not(:disabled) {
    border-color: var(--caretta-navy);
    color: var(--caretta-navy-deep);
    background: var(--caretta-navy-50);
}

/* ---- 5.3 Pastile semafor in-rand (Vizite + Planificator) -------------- */
/* Re-randate pe tokenii semafor pentru consistenta vizuala intre module.
   Scoparea #view-* (id+clasa) bate baza nescopata clasa-unica fara !important. */
#view-visits .vdb-priority-pill,
#view-visits .vdb-status-pill,
#view-visit-planner .vdb-priority-pill,
#view-visit-planner .vdb-status-pill,
#view-visits .visit-location-status,
#view-visit-planner .visit-location-status {
    border-radius: var(--r-pill);
    font-weight: 800;
    letter-spacing: .01em;
}
#view-visits .vdb-priority-critica,
#view-visit-planner .vdb-priority-critica,
#view-visits .vdb-status-rosu,
#view-visit-planner .vdb-status-rosu {
    background: color-mix(in srgb, var(--signal-action) 16%, transparent);
    color: var(--signal-action);
}
#view-visits .vdb-priority-mare,
#view-visit-planner .vdb-priority-mare,
#view-visits .vdb-priority-medie,
#view-visit-planner .vdb-priority-medie,
#view-visits .vdb-status-galben,
#view-visit-planner .vdb-status-galben {
    background: color-mix(in srgb, var(--signal-watch) 16%, transparent);
    color: color-mix(in srgb, var(--signal-watch) 88%, #000);
}
#view-visits .vdb-status-verde,
#view-visit-planner .vdb-status-verde {
    background: color-mix(in srgb, var(--signal-on-track) 16%, transparent);
    color: color-mix(in srgb, var(--signal-on-track) 86%, #000);
}
#view-visits .vdb-priority-mica,
#view-visit-planner .vdb-priority-mica {
    background: color-mix(in srgb, var(--signal-info) 14%, transparent);
    color: color-mix(in srgb, var(--signal-info) 90%, #000);
}

/* ---- 5.4 Planificator — antet de sectiune cu eyebrow + linie ---------- */
#view-visit-planner .vplan-section-head {
    border-bottom: 1px solid var(--border-subtle);
    padding-bottom: var(--sp-2);
}
#view-visit-planner .vplan-section-head h4 {
    color: var(--caretta-navy-deep);
    font-weight: 800;
    letter-spacing: .005em;
}
#view-visit-planner .vplan-section-head p { color: var(--text-soft); }

/* ---- 5.5 Planificator — culori text card de ZI (NEblocate de !important) */
/* Corpul cardului, ::before si controlbar NU pot fi suprascrise fara !important
   (views.css 10177/10193/10265) -> au fost scoase. Pastram doar culorile text. */
#view-visit-planner .vplan-day-head h5,
#view-visit-planner .vplan-day-head h5 b {
    color: var(--caretta-navy-deep);
}

/* Stops din zi -> card curat cu accent navy (baza .vplan-stop = clasa unica,
   fara !important -> scoparea #view-visit-planner castiga curat) */
#view-visit-planner .vplan-stop {
    border: 1px solid var(--border-subtle);
    border-radius: var(--r-md);
    background: var(--bg-surface);
    transition: border-color .14s ease, box-shadow .14s ease;
}
#view-visit-planner .vplan-stop:hover {
    border-color: color-mix(in srgb, var(--caretta-navy) 30%, var(--border-subtle));
    box-shadow: var(--elev-1);
}
/* Culori text pe stops + partner-row (NEblocate de !important) */
#view-visit-planner .vplan-stop-time,
#view-visit-planner .vplan-partner-time,
#view-visit-planner .vplan-partner-score b {
    color: var(--caretta-navy);
}
#view-visit-planner .vplan-stop b,
#view-visit-planner .vplan-partner-main strong {
    color: var(--text-strong);
}
#view-visit-planner .vplan-map-link {
    border-radius: var(--r-md);
    color: var(--caretta-navy);
    background: var(--caretta-navy-50);
}
#view-visit-planner .vplan-map-link:hover {
    color: #fff;
    background: var(--caretta-navy);
}
#view-visit-planner .vplan-replace-select,
#view-visit-planner .vplan-day-date {
    border: 1px solid var(--border-subtle);
    border-radius: var(--r-sm);
    color: var(--text-default);
}

/* ---- 5.6 Planificator — cardul „Nevoie locatie" ca semnal de actiune -- */
#view-visit-planner .vplan-location-card {
    border: 1px solid color-mix(in srgb, var(--signal-action) 26%, transparent);
    background: color-mix(in srgb, var(--signal-action) 5%, var(--bg-surface));
    border-radius: var(--r-md);
}
#view-visit-planner .vplan-location-card strong { color: var(--text-strong); }
#view-visit-planner .vplan-location-card em {
    color: var(--signal-action);
    background: color-mix(in srgb, var(--signal-action) 12%, transparent);
    border-radius: var(--r-pill);
}

/* ---- 5.7 Nota de configurare planificator -> cadru token-curat -------- */
#view-visit-planner .vplan-config-note {
    border: 1px solid var(--border-subtle);
    border-radius: var(--r-md);
    background: var(--caretta-navy-50);
    color: var(--text-soft);
}



/* =========================================================================
 * 6. DARK MODE REAL — strat de tokeni theme-aware (body.dark-mode)
 * Cauza pacalelii: tokenii (--bg-surface/--text-strong/--border-subtle etc.)
 * aveau o singura valoare (light). Aici ii inversam pe TOTI (vechi + design)
 * -> tot ce foloseste tokeni devine dark consistent. Paleta navy-slate premium.
 * Brand (navy/rosu) + semafor raman (functioneaza pe dark). Culorile HARDCODATE
 * din module se repara separat (audit per modul).
 * ========================================================================= */
body.dark-mode {
  /* Legacy tokens */
  --bg-color: #0e1620;
  --surface-color: #18222e;
  --text-main: #eef2f7;
  --text-muted: #93a1b4;
  --border-color: #28333f;
  --card-shadow: 0 12px 30px -10px rgba(0,0,0,0.55), 0 4px 10px -2px rgba(0,0,0,0.4);
  --card-shadow-hover: 0 20px 40px -12px rgba(0,0,0,0.62), 0 8px 16px -4px rgba(0,0,0,0.45);

  /* Surface */
  --bg-canvas: #0e1620;
  --bg-surface: #18222e;
  --bg-surface-hover: #202b38;
  --bg-elevated: #1d2733;
  --bg-subtle: #131c25;

  /* Text */
  --text-strong: #f1f5f9;
  --text-default: #dde5ee;
  --text-soft: #94a3b4;
  --text-faint: #6b7a8c;

  /* Borders & elevations */
  --border-subtle: #28333f;
  --border-strong: #3a4856;
  --elev-1: 0 1px 2px rgba(0,0,0,0.4);
  --elev-2: 0 4px 12px -2px rgba(0,0,0,0.45);
  --elev-3: 0 12px 28px -8px rgba(0,0,0,0.55);

  /* Brand tints (light -> dark) */
  --caretta-navy-50: #1b2a37;
  --caretta-red-soft: #3a1622;
  --card-bg: var(--bg-surface);
}



/* =========================================================================
 * 7. DARK MODE — fix culori HARDCODATE per zona (workflow audit: 8 agenti + verify)
 * Toate sub body.dark-mode -> ZERO impact light. (dbp re-facut separat.)
 * ========================================================================= */
/* ===== DARK [layout] Chrome / layout ===== */
/* =========================================================================
 * DARK MODE — CHROME / LAYOUT (sidebar, topbar, nav, fundal, scrollbar)
 * Repara culorile HARDCODATE din chrome care NU se inverseaza prin tokeni:
 *  - fundalul desktop al paginii era un gradient ALB (orbitor pe dark);
 *  - navy (#003349) folosit ca CULOARE DE TEXT pe suprafete dark = invizibil
 *    (titlu pagina, nav activ, iconite nav, toggle-uri mobile) -> deschidem
 *    textul la un navy luminos lizibil, pastrand identitatea brand;
 *  - borduri rgba(0,0,0,..) invizibile pe dark -> token de bordura.
 * Banda navy de fundal, accentul rosu si semaforul raman neatinse.
 * ========================================================================= */

/* Fundal pagina (desktop) — gradientul alb hardcodat -> canvas dark */
@media (min-width: 821px) {
  body.dark-mode {
    background:
      linear-gradient(180deg, var(--bg-canvas), #0b121b);
  }
}

/* Titlul paginii din header — navy hardcodat -> text deschis lizibil */
body.dark-mode .header-left h1 {
  color: var(--text-strong);
}

/* Sidebar: link activ + iconite — navy text pe tinta navy-50 dark = invizibil */
body.dark-mode .menu a.active,
body.dark-mode .menu a.active i,
body.dark-mode .menu a:hover i {
  color: #7db8d4; /* navy brand luminat pentru contrast pe dark */
}

/* Navigatie mobila: bara de jos activa + sheet "Mai multe" activ + iconite */
body.dark-mode .mobile-bottom-nav button.active,
body.dark-mode .mobile-bottom-nav button[aria-expanded="true"],
body.dark-mode .mobile-more-sheet button[data-mobile-target].active,
body.dark-mode .mobile-more-sheet button[data-mobile-target].active i,
body.dark-mode .mobile-more-sheet button[data-mobile-target] i {
  color: #7db8d4;
}

/* Toggle-uri mobile (tabel / dashboard) — navy text pe surface dark = sters */
body.dark-mode .mobile-table-toggle,
body.dark-mode .mobile-dashboard-toggle {
  color: #7db8d4;
}

/* Bordura interna a breakdown-ului KPI — rgba(0,0,0) invizibil pe dark */
body.dark-mode .cc-kpi-breakdown {
  border-top-color: var(--border-subtle);
}


/* ===== DARK [components] Componente generice ===== */
/* =========================================================================
 * DARK MODE — Componente generice: modale, inputuri, dropdown, carduri interne
 * Repara culorile HARDCODATE (#fff / #f8fafc / #10233f / cutii eroare roz)
 * care nu aveau override body.dark-mode -> dale albe orbitoare + text invizibil.
 * Tot scopat sub body.dark-mode (light mode neatins). Brand (navy/rosu) +
 * semafor raman; doar fundalurile albe -> suprafete dark + text deschis.
 * ========================================================================= */

/* ---- 1. VISIT MODAL — inputuri: text deschis + fundal suprafata dark ----
   (#visit-modal input/select/textarea aveau color:#10233f hardcodat -> invizibil;
    la :focus background:#fff -> orbitor). Le aducem pe tokeni dark. */
body.dark-mode #visit-modal input,
body.dark-mode #visit-modal select,
body.dark-mode #visit-modal textarea,
body.dark-mode .visit-form-grid input,
body.dark-mode .visit-form-grid select,
body.dark-mode .visit-form-grid textarea,
body.dark-mode .visit-subrow input,
body.dark-mode .visit-subrow select,
body.dark-mode .visit-contact-picker select,
body.dark-mode .visit-action-card input,
body.dark-mode .visit-action-card select,
body.dark-mode .visit-action-card textarea {
    background: var(--bg-subtle);
    color: var(--text-default);
    border-color: var(--border-subtle);
}
body.dark-mode #visit-modal input::placeholder,
body.dark-mode #visit-modal textarea::placeholder,
body.dark-mode .visit-form-grid input::placeholder,
body.dark-mode .visit-form-grid textarea::placeholder {
    color: var(--text-faint);
}
body.dark-mode #visit-modal input:focus,
body.dark-mode #visit-modal select:focus,
body.dark-mode #visit-modal textarea:focus,
body.dark-mode .visit-form-grid input:focus,
body.dark-mode .visit-form-grid select:focus,
body.dark-mode .visit-form-grid textarea:focus,
body.dark-mode .visit-subrow input:focus,
body.dark-mode .visit-subrow select:focus {
    background: var(--bg-elevated);
    color: var(--text-strong);
    border-color: var(--signal-info);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--signal-info) 22%, transparent);
}
/* select dropdown options lizibile (UA le pune pe fundal de sistem) */
body.dark-mode #visit-modal select option,
body.dark-mode .visit-form-grid select option,
body.dark-mode #planner-new-partner-modal select option {
    background: var(--bg-elevated);
    color: var(--text-default);
}

/* ---- 2. VISIT MODAL — carduri/suprafete interne hardcodate #fff/#f8fafc ----
   visit-step-card, visit-action-card, vdb-today-card/signal-row/today-list etc. */
body.dark-mode .visit-step-card,
body.dark-mode .visit-action-card,
body.dark-mode .visit-modal-content .vdb-today-card,
body.dark-mode .visit-modal-content .vdb-signal-row,
body.dark-mode .visit-modal-content .vdb-today-list {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
}
/* Detaliile (accordion) din modal: baza la views.css:3153 e pe tokeni, DAR
   exista un duplicat cu ID la views.css:9171 (#visit-modal .visit-modal-content
   details { background:#fff }) cu specificitate 0,1,2,1 care ar bate un override
   doar pe .dark-mode. De aceea prefixam cu #visit-modal -> 0,1,2,1 / 0,1,2,2,
   ca sa invingem sigur regula alba. */
body.dark-mode #visit-modal .visit-modal-content details {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
}
body.dark-mode #visit-modal .visit-modal-content details > summary {
    color: var(--text-strong);
}
body.dark-mode #visit-modal .visit-modal-content details > summary small {
    color: var(--text-soft);
}

/* ---- 3. Cutii de eroare in modal — rosul ramane (semafor), dar pe fundal
   translucid inchis cu text deschis-rosu, nu roz-alb cu text negru-rosu ---- */
body.dark-mode .visit-form-errors,
body.dark-mode .visit-inline-error {
    background: color-mix(in srgb, var(--signal-action) 16%, var(--bg-surface));
    border-color: color-mix(in srgb, var(--signal-action) 42%, transparent);
    color: #fca5a5;
}

/* ---- 4. PLANNER „Partener nou" — modal intreg alb -> suprafete dark ---- */
body.dark-mode .planner-new-partner-dialog {
    background: var(--bg-canvas);
    border-color: var(--border-subtle);
}
body.dark-mode .planner-new-partner-header,
body.dark-mode .planner-new-partner-actions {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
}
body.dark-mode .planner-new-partner-advanced {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
}
body.dark-mode #planner-new-partner-modal input,
body.dark-mode #planner-new-partner-modal select {
    background: var(--bg-subtle);
    color: var(--text-default);
    border-color: var(--border-subtle);
}
body.dark-mode #planner-new-partner-modal input:focus,
body.dark-mode #planner-new-partner-modal select:focus {
    background: var(--bg-elevated);
    color: var(--text-strong);
    border-color: var(--signal-info);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--signal-info) 22%, transparent);
}

/* ---- 5. SEARCHABLE MULTISELECT (dropdown) — control + panou alb -> dark ----
   .sms-chip ramane navy (brand). Doar fundalurile albe se inchid. */
body.dark-mode .sms-selected {
    background: var(--bg-subtle);
    border-color: var(--border-subtle);
}
body.dark-mode .sms-control.open .sms-selected {
    border-color: var(--signal-info);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--signal-info) 22%, transparent);
}
body.dark-mode .sms-control.disabled .sms-selected {
    background: var(--bg-canvas);
}
body.dark-mode .sms-dropdown {
    background: var(--bg-elevated);
    border-color: var(--border-subtle);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.5);
}
body.dark-mode .sms-option {
    color: var(--text-default);
}
body.dark-mode .sms-option:hover {
    background: var(--bg-surface-hover);
    border-color: var(--border-subtle);
}
body.dark-mode .sms-option.active {
    background: color-mix(in srgb, var(--signal-info) 18%, transparent);
    border-color: color-mix(in srgb, var(--signal-info) 32%, transparent);
}
body.dark-mode .sms-option small {
    color: var(--text-soft);
}


/* ===== DARK [cc] Command Center ===== */
/* === DARK MODE — Command Center (cc-*) === */

/* Cauza principala: tokenul --card-bg NU e definit nicaieri in proiect -> in dark
   face fallback la alb (#fff) peste tot unde apare ca background sau in gradient
   (.cc-target-unified, .cc-today-card, .cc-action-item, .cc-target-card-left/right
   si controalele cc-kpi- ramase). Carduri = dale albe orbitoare. Definim --card-bg
   pe zona CC in dark -> toate background: var(--card-bg) si
   color-mix(... var(--card-bg)) se rezolva pe o suprafata dark (--bg-surface =
   #18222e in dark), dintr-o regula. */
body.dark-mode #view-command-center {
  --card-bg: var(--bg-surface);
}

/* Titlul „Command Center" e navy (#003349) -> pe canvas near-black devine
   ilizibil. Pe dark il aducem la text deschis (aici e text, nu fill de brand). */
body.dark-mode .cc-hero-title {
  color: var(--text-strong);
}

/* Chip-uri context din hero: tinta navy 8% peste transparent ~ invizibila pe
   dark. Le dam o suprafata subtila + bordura vizibila; iconul ramane soft. */
body.dark-mode .cc-hero-chip {
  background: var(--bg-subtle);
  border-color: var(--border-subtle);
  color: var(--text-default);
}
body.dark-mode .cc-hero-chip i {
  color: var(--text-soft);
}

/* Badge-uri de risc: fundaluri pastel deschise (#fee2e2/#ffedd5/#e0f2fe) cu text
   inchis -> pastila orbitoare pe card dark. Re-tintam pe versiuni dark translucide
   ale semaforului, cu text deschis (pastram semantica de culoare). */
body.dark-mode .cc-risk-critical {
  color: #fca5a5;
  background: color-mix(in srgb, var(--signal-action) 20%, transparent);
  border-color: color-mix(in srgb, var(--signal-action) 38%, transparent);
}
body.dark-mode .cc-risk-urgent {
  color: #fdba74;
  background: color-mix(in srgb, var(--signal-watch) 20%, transparent);
  border-color: color-mix(in srgb, var(--signal-watch) 38%, transparent);
}
body.dark-mode .cc-risk-medium {
  color: #7dd3fc;
  background: color-mix(in srgb, var(--signal-info) 20%, transparent);
  border-color: color-mix(in srgb, var(--signal-info) 38%, transparent);
}


/* ===== DARK [reports] Report views (tabele/filtre) ===== */
/* ============================================================
   DARK MODE — Report views: filtre globale (slicere)
   CORECTAT dupa review adversarial.
   ELIMINAT: repaint .slicers-wrapper (containerul #global-filters-container
     primeste deja fundal dark in layout.css:1558, iar wrapper-ul e
     intentionat transparent in layout.css:1565-1569 -> NU-l repictam,
     altfel rezulta dala-in-dala).
   ELIMINAT: regulile .crm-source-badge.crm/.prospect/.crm-prospect-note
     (au deja tratament semafor color-mix(... var(--text-strong)) in
     premium-theme.css:647-668 care se inverseaza singur in dark prin
     tokenii redefiniti la 1336-1369 -> erau redundante + contradictorii).
   PASTRAT: doar fixul de LIZIBILITATE pe slicere (text/bordura), care NU
     e acoperit de override-urile existente (views.css hardcodeaza
     color:#0f2f4f + border:#d7e2ee fara dark; components.css:635 seteaza
     doar background). .active ramane pe brand navy/albastru.
   Tot scopat sub body.dark-mode -> light mode intact.
   ============================================================ */

/* --- Slicerele din filtrele globale: text inchis (#0f2f4f) + bordura
       deschisa (#d7e2ee) din views.css NU au override dark -> tokeni dark.
       Fundalul NU il setam: il lasa pe seama components.css:635
       (.slicer-btn:not(.active){background-color:var(--bg-color)}) ca sa
       nu introducem un al doilea fundal in conflict. --- */
body.dark-mode #global-filters-container .slicer-btn {
    border-color: var(--border-subtle);
    color: var(--text-default);
}
body.dark-mode #global-filters-container .slicer-btn:hover {
    border-color: var(--border-strong);
    color: var(--text-strong);
}
/* .active (#003349 navy) si varianta reg_only (#0b5aa8 albastru) sunt
   brand/accent intentionat -> raman pe ambele teme; doar asiguram textul
   alb clar pe fundalul lor inchis. */
body.dark-mode #global-filters-container .slicer-btn.active {
    color: #fff;
}


/* ===== DARK [visits] Vizite + Planificator ===== */
/* ===== DARK MODE — Vizite + Planificator (#view-visits / #view-visits-dashboard / #view-visit-planner) =====
   Repara culorile HARDCODATE (background/color/border #fff,#f8fafc,#f6f9fd,#eaf3fc, text #172033/#5c6b7d/#5f6f82/#66778a/#27364a/#64748b si navy #003349 folosit ca text)
   din zonele vdb-* / vplan-* / visit-* care NU aveau override dark. Tot scopat sub body.dark-mode -> light mode neatins.
   NU re-tematizeaza: .vdb-filters-panel/.vdb-period-chip/.vdb-control/.vdb-clear-search/.vdb-planner-note (deja au override), semafoarele si brandul navy/rosu. */

/* --- Planificator: cardul de zi + header + controlbar (blocul premium 10177+, are !important) --- */
body.dark-mode #view-visit-planner .vplan-day-card {
    background: var(--bg-surface) !important;
    border-color: var(--border-subtle) !important;
    border-top-color: var(--caretta-navy) !important; /* banda navy de brand ramane */
}
body.dark-mode #view-visit-planner .vplan-day-top {
    background: linear-gradient(180deg, var(--bg-subtle) 0%, var(--bg-surface) 100%) !important;
    border-bottom-color: var(--border-subtle);
}
body.dark-mode #view-visit-planner .vplan-day-controlbar {
    background: var(--bg-subtle) !important;
    border-bottom-color: var(--border-subtle) !important;
}
body.dark-mode #view-visit-planner .vplan-day-title h5,
body.dark-mode #view-visit-planner .vplan-day-title h5 b,
body.dark-mode #view-visit-planner .vplan-day-title h5 em {
    color: var(--text-default);
}
body.dark-mode #view-visit-planner .vplan-day-title p {
    color: var(--text-soft);
}
body.dark-mode #view-visit-planner .vplan-date-field em {
    color: var(--text-soft);
}

/* badge zi + marker ora: erau bg #eaf3fc / text navy #003349 (navy-pe-dark = invizibil) -> tint navy inchis + text deschis */
body.dark-mode #view-visit-planner .vplan-day-badge,
body.dark-mode #view-visit-planner .vplan-stop-marker span {
    background: var(--caretta-navy-50) !important; /* #1b2a37 in dark */
    color: #cfe3f2 !important;
}
body.dark-mode #view-visit-planner .vplan-stop-marker::before {
    background: var(--border-strong);
}

/* tiles metrici zi */
body.dark-mode #view-visit-planner .vplan-day-metrics span {
    background: var(--bg-subtle);
    border-color: var(--border-subtle);
    color: var(--text-soft);
}

/* unelte (summary + dropdown popover) */
body.dark-mode #view-visit-planner .vplan-day-tools summary {
    background: var(--bg-subtle);
    border-color: var(--border-subtle);
}
body.dark-mode #view-visit-planner .vplan-day-tools > div {
    background: var(--bg-elevated);
    border-color: var(--border-subtle);
}

/* randul-partener / cardul-partener din traseu (bg #fff !important la 10367/9364) */
body.dark-mode #view-visit-planner .vplan-partner-row.vplan-partner-card,
body.dark-mode #view-visit-planner .vplan-partner-card {
    background: var(--bg-subtle) !important;
    border-color: var(--border-subtle) !important;
}
body.dark-mode #view-visit-planner .vplan-partner-line strong {
    color: var(--text-default);
}

/* tiles quick / detail (bg #f8fafc !important, border #edf2f7, label #66778a) */
body.dark-mode #view-visit-planner .vplan-partner-quick span,
body.dark-mode #view-visit-planner .vplan-detail-grid span {
    background: var(--bg-surface) !important;
    border-color: var(--border-subtle) !important;
    color: var(--text-default);
}
body.dark-mode #view-visit-planner .vplan-partner-quick b,
body.dark-mode #view-visit-planner .vplan-detail-grid b {
    color: var(--text-soft);
}
body.dark-mode #view-visit-planner .vplan-reason {
    color: var(--text-soft);
}

/* summary "detalii" partener: era navy #003349 ca text -> deschis pe dark */
body.dark-mode #view-visit-planner .vplan-partner-details summary {
    color: #cfe3f2;
}

/* empty-day placeholder */
body.dark-mode #view-visit-planner .vplan-empty-day {
    background: var(--bg-subtle);
    border-color: var(--border-subtle);
}
body.dark-mode #view-visit-planner .vplan-empty-day strong {
    color: var(--text-default);
}
body.dark-mode #view-visit-planner .vplan-empty-day p {
    color: var(--text-soft);
}

/* inputuri din controlbar/replace: foloseau var(--card-bg) (nedefinit -> transparent) */
body.dark-mode #view-visit-planner .vplan-day-date,
body.dark-mode #view-visit-planner .vplan-add-select,
body.dark-mode .vplan-replace-select,
body.dark-mode .vplan-day-date {
    background: var(--bg-subtle);
    border-color: var(--border-subtle);
    color: var(--text-default);
}

/* --- Dashboard Vizite: carduri "azi" / semnale / actiuni (bg #fff fara override) --- */
body.dark-mode .vdb-today-card,
body.dark-mode .vdb-signal-row,
body.dark-mode .vdb-today-list {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
}
body.dark-mode .vdb-today-card p {
    color: var(--text-soft);
}
/* drilldown dialog: light folosea var(--card-bg) NEDEFINIT -> transparent pe dark; fixat la --bg-surface */
body.dark-mode .vdb-drilldown-dialog {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
}

/* --- Modal vizita: form / accordion / picker (bg alb hardcodat) --- */
body.dark-mode .visit-action-card {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
}
body.dark-mode .visit-contact-picker select {
    background: var(--bg-subtle);
    border-color: var(--border-subtle);
    color: var(--text-default);
}
body.dark-mode .visit-summary-toggle {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
}
/* FIX specificitate: regula light #visit-modal .visit-partner-accordion details (views.css 9170, bg #fff)
   are specificitate (0,2,1) = EGALA cu .visit-partner-accordion details simplu; ca sa castige decisiv
   (nu doar prin source order) ridicam contextul la #visit-modal -> (0,3,1). Tot sub body.dark-mode. */
body.dark-mode #visit-modal .visit-partner-accordion details,
body.dark-mode .visit-partner-accordion details {
    background: var(--bg-subtle);
    border-color: var(--border-subtle);
}
body.dark-mode .visit-partner-accordion summary {
    color: var(--text-default);
}
/* FIX specificitate: regula light #visit-modal .visit-info-grid span (views.css 9189, bg #f8fafc) (0,2,1)
   -> ridicam la #visit-modal pentru a castiga sigur. */
body.dark-mode #visit-modal .visit-info-grid span,
body.dark-mode .visit-info-grid span {
    background: var(--bg-subtle);
    border-color: var(--border-subtle);
    color: var(--text-soft);
}
body.dark-mode .visit-info-grid b {
    color: var(--text-default);
}


/* ===== DARK [scad-obj] Scadentar + Obiective ===== */
/* === DARK MODE FIX: Scadentar + Obiective === */
/* Defect real: antetul Registrului Obiective (#obiectiveTable thead th) e setat
   in premium-theme.css:1074 NEguardat cu color:var(--caretta-navy-deep) (#002637)
   pe background:var(--caretta-navy-50). In dark, --caretta-navy-50 devine #1b2a37
   (premium-theme.css:1367) dar --caretta-navy-deep NU are override (singura
   definitie: variables.css:40) -> text cvasi-negru pe fundal inchis = antet
   invizibil. Specificitatea body.dark-mode (0,1,2,2) bate regula de baza (0,2,2).
   color = --text-strong pentru consecventa cu regulile dark desktop existente
   pe ACELASI thead (views.css:11635, layout.css:1759). Restul zonei (sc-table
   thead pe --bg-subtle/--text-soft, coloana clasa strong pe --text-strong la
   premium-theme.css:1095-1096) foloseste deja tokeni theme-aware -> corect pe
   dark, neatins. Semaforul brand ramane neatins. */
body.dark-mode #view-obiective #obiectiveTable thead th {
    background: var(--bg-subtle);            /* #131c25 — antet pe ton inchis */
    color: var(--text-strong);               /* #f1f5f9 — etichete lizibile, consecvent cu restul antetelor dark */
    border-bottom: 1px solid var(--border-strong);
}


/* ===== DARK [mkt-expo] Marketing + Expozoare + Paleti ===== */
/* === DARK MODE: Paleti (pallets-*) — pastile directie + cantitate retur ===
   Marketing (mkt-*) si Expozoare (expo-*) sunt deja pe tokeni si se
   inverseaza automat; #fff pe navy/verde/rosu de brand+semafor raman
   corecte -> nicio regula pentru ele. Aici repar DOAR culorile hardcodate
   din Paleti care NU au deja override body.dark-mode si s-ar vedea
   dark-on-dark in tema intunecata. Fundalurile alpha (sky/orange) raman;
   ridic doar culoarea textului spre variante deschise lizibile, pastrand
   semantica semaforului. (.pallets-hero/.pallets-source/.pallet-filter-grid/
   #palletsTable thead th/.pallet-class-pill/.pallet-return-row au deja
   override corect -> nu le reating.) */
body.dark-mode .pallet-direction.delivery {
    color: #7dd3fc;                      /* sky-300: livrare, lizibil pe dark */
    background: rgba(14, 165, 233, 0.18);
}
body.dark-mode .pallet-direction.return {
    color: #fdba74;                      /* orange-300: retur, lizibil pe dark */
    background: rgba(249, 115, 22, 0.20);
}
body.dark-mode .pallet-return-qty {
    color: #fdba74;                      /* aliniat la pastila de retur */
}


/* =========================================================================
 * DARK [dbp] DB Parteneri: culori HARDCODATE fără override (audit modul)
 * Toate sub body.dark-mode -> ZERO impact light. Brand navy (.ds-hero) +
 * roșu accent + semafor RĂMÂN. Preferă tokeni theme-aware.
 * ========================================================================= */

/* ---- A. FIȘA — inputuri/select/textarea (#fff + text #10233f hardcodate) ---- */
body.dark-mode #dbp-partner-modal input,
body.dark-mode #dbp-partner-modal select,
body.dark-mode #dbp-partner-modal textarea {
    background: var(--bg-subtle);
    color: var(--text-default);
    border-color: var(--border-subtle);
}
body.dark-mode #dbp-partner-modal input:focus,
body.dark-mode #dbp-partner-modal select:focus,
body.dark-mode #dbp-partner-modal textarea:focus {
    background: var(--bg-elevated);
    color: var(--text-strong);
    border-color: var(--signal-info);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--signal-info) 22%, transparent);
}
body.dark-mode #dbp-partner-modal select option {
    background: var(--bg-elevated);
    color: var(--text-default);
}

/* ---- B. Card ANAF prioritar (gradient alb-albastru -> dark) ---- */
body.dark-mode .dbp-prime-anaf-card,
body.dark-mode .dbp-prime-anaf-card.is-verified,
body.dark-mode .dbp-prime-anaf-card.is-warn {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
    box-shadow: var(--elev-2);
}
body.dark-mode .dbp-prime-anaf-card.is-verified { border-color: color-mix(in srgb, var(--signal-on-track) 50%, var(--border-subtle)); }
body.dark-mode .dbp-prime-anaf-card.is-warn     { border-color: color-mix(in srgb, var(--signal-watch) 50%, var(--border-subtle)); }
body.dark-mode .dbp-prime-anaf-kicker { color: var(--signal-info); }
body.dark-mode .dbp-prime-anaf-title  { color: var(--text-strong); }
body.dark-mode .dbp-prime-anaf-field label { color: var(--text-soft); }
body.dark-mode .dbp-prime-anaf-pill { background: color-mix(in srgb, var(--signal-info) 20%, transparent); color: #7dd3fc; }
body.dark-mode .dbp-prime-anaf-card.is-verified .dbp-prime-anaf-pill { background: color-mix(in srgb, var(--signal-on-track) 18%, transparent); color: #6ee7b7; }
body.dark-mode .dbp-prime-anaf-card.is-warn .dbp-prime-anaf-pill { background: color-mix(in srgb, var(--signal-watch) 18%, transparent); color: #fcd34d; }
body.dark-mode .dbp-prime-anaf-card #dbp-new-partner-cui {
    background: var(--bg-subtle);
    border-color: var(--border-strong);
    color: var(--text-strong);
}

/* ---- C. Grila card date + card rezultat ANAF ---- */
body.dark-mode .dbp-partner-card-grid {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
}
body.dark-mode .dbp-anaf-result-card {
    background: var(--bg-subtle) !important;
    border-color: var(--border-subtle) !important;
}

/* ---- D. Secțiuni delimitate (.dbp-section + marketing violet) ---- */
body.dark-mode #dbp-partner-modal .dbp-section {
    background: var(--bg-surface);
    border-color: var(--border-subtle);
}
body.dark-mode #dbp-partner-modal .dbp-section[open] > summary {
    border-bottom-color: var(--border-subtle);
}
body.dark-mode #dbp-partner-modal .dbp-section-marketing {
    background: color-mix(in srgb, #8b5cf6 9%, var(--bg-surface));
    border-color: color-mix(in srgb, #8b5cf6 38%, var(--border-subtle));
}
body.dark-mode #dbp-partner-modal .dbp-section-marketing > summary { color: #c4b5fd; }
body.dark-mode #dbp-partner-modal .dbp-section-marketing > summary i { color: #a78bfa; }

/* ---- E. Panou ANAF / documente (.visit-anaf-panel) + inputuri interne ---- */
body.dark-mode #dbp-partner-modal .dbp-section .visit-anaf-panel { background: var(--bg-subtle); }
body.dark-mode #dbp-partner-modal .visit-anaf-panel input,
body.dark-mode #dbp-partner-modal .visit-anaf-panel textarea { background: var(--bg-elevated); }
body.dark-mode .visit-anaf-panel-head span {
    background: color-mix(in srgb, var(--signal-info) 16%, transparent);
    color: #7dd3fc;
    border-color: color-mix(in srgb, var(--signal-info) 34%, transparent);
}

/* ---- F. Multiselect expozoare inline (.dbp-ms-*) ---- */
body.dark-mode #dbp-partner-modal .dbp-ms-control { border-color: var(--border-subtle); }
body.dark-mode .dbp-ms-panel {
    background: var(--bg-elevated);
    border-color: var(--border-subtle);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.5);
}
body.dark-mode .dbp-ms-opt:hover   { background: var(--bg-surface-hover); }
body.dark-mode .dbp-ms-opt.selected { background: color-mix(in srgb, var(--signal-info) 16%, transparent); }
body.dark-mode .dbp-ms-check { border-color: var(--border-strong); }
body.dark-mode .dbp-ms-opt .dbp-ms-opt-cat,
body.dark-mode .dbp-ms-opt .dbp-ms-preview-cat { color: #a78bfa; }
body.dark-mode .dbp-ms-preview {
    background: var(--bg-elevated);
    border-color: var(--border-subtle);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.55);
}
body.dark-mode .dbp-ms-preview img,
body.dark-mode .dbp-ms-preview .dbp-ms-preview-noimg { background: var(--bg-subtle); }
body.dark-mode .dbp-ms-preview .dbp-ms-preview-name { color: var(--text-strong); }
body.dark-mode .dbp-ms-preview .dbp-ms-preview-cat { color: #a78bfa; }

/* ---- G. Generator contracte (.dbp-contract-*) ---- */
body.dark-mode .dbp-contract-generator {
    background: var(--bg-surface) !important;
    border-color: var(--border-subtle) !important;
}
body.dark-mode .dbp-contract-type-switch label,
body.dark-mode .dbp-contract-doc-option,
body.dark-mode .dbp-contract-preview {
    background: var(--bg-subtle);
    border-color: var(--border-subtle);
    color: var(--text-default);
}
body.dark-mode .dbp-contract-type-switch label.active {
    background: color-mix(in srgb, var(--signal-info) 16%, transparent);
    border-color: var(--signal-info);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--signal-info) 22%, transparent);
}
body.dark-mode .dbp-contract-preview td { border-bottom-color: var(--border-subtle); }
body.dark-mode .dbp-contract-list-row { border-bottom-color: var(--border-subtle); }

/* ---- H. Mod VIEW read-only ---- */
body.dark-mode #dbp-partner-modal.dbp-view-mode input,
body.dark-mode #dbp-partner-modal.dbp-view-mode select,
body.dark-mode #dbp-partner-modal.dbp-view-mode textarea {
    background: var(--bg-canvas) !important;
    color: var(--text-soft);
}
body.dark-mode #dbp-partner-modal.dbp-view-mode .dbp-ms-control { background: var(--bg-canvas); }
body.dark-mode #dbp-partner-modal.dbp-view-mode .dbp-contract-generator input,
body.dark-mode #dbp-partner-modal.dbp-view-mode .dbp-contract-generator select,
body.dark-mode #dbp-partner-modal.dbp-view-mode .dbp-contract-generator textarea {
    background: var(--bg-subtle) !important;
    color: var(--text-default);
}

/* ---- I. COMPONENTE PREMIUM — ds-tabs/ds-stat contrast (ds-hero rămâne navy) ---- */
body.dark-mode .dbp-fisa-tabs { background: var(--bg-surface); }
body.dark-mode .ds-tab.is-active { color: var(--text-strong); }
body.dark-mode .ds-tab.is-active .ds-tab__count { background: var(--caretta-red-soft); color: #fda4c2; }

/* ---- J. LISTA (#view-crm) — accente violet hardcodate -> mai deschise ---- */
body.dark-mode .crmx-bo.has,
body.dark-mode .crmx-block-h.bitrix { color: #c4b5fd; }
body.dark-mode .crmx-diff.new { background: color-mix(in srgb, #8b5cf6 18%, transparent); color: #c4b5fd; }


/* =========================================================================
 * REDESIGN BI — Faza 2a: Radar Zilnic (declutter Command Center, REVERSIBIL)
 * Auditul: 3-4 mecanisme paralele de prioritizare spun aceeasi poveste.
 * Ascundem duplicatele (Harta de recuperare + Top 3 actiuni + Bottleneck) si
 * pastram: verdict, Unde sunt acum, Ce trebuie facut azi, 4 KPI, palnie,
 * bani de recuperat top-5, grafice. DOAR CSS -> JS ruleaza normal (populeaza
 * elemente ascunse), zero risc, reversibil instant.
 * ========================================================================= */
#view-command-center #cc-section-recovery { display: none; }
#view-command-center #cc-bottleneck { display: none !important; }


/* =========================================================================
 * REDESIGN BI — Faza 2b: Radar — reordonare Command Center pe fluxul deciziei.
 * .dashboard-grid e flex column -> reordonez prin CSS order pe copiii directi.
 * Zero DOM mutat, zero JS atins, reversibil. Bani de recuperat urca langa palnie.
 * ========================================================================= */
#view-command-center > .cc-hero--header          { order: 1; }
#view-command-center > #cc-verdict                { order: 2; }
#view-command-center > #cc-section-acum           { order: 3; }
#view-command-center > #cc-section-today          { order: 4; }
#view-command-center > #cc-section-restante       { order: 5; }
#view-command-center > #cc-section-pipeline       { order: 6; }
#view-command-center > #cc-section-restante-list  { order: 7; }
#view-command-center > .cc-top-grid               { order: 8; }
#view-command-center > .cc-grid-2col              { order: 9; }
#view-command-center > .cc-chart-card             { order: 10; }
#view-command-center > .cc-module-shortcuts       { order: 11; }
#view-command-center > #cc-section-kpi            { order: 12; }


/* Faza 2c — Radar: strip Ce s-a schimbat de ieri (delte zi-cu-zi) */
#view-command-center > #cc-delta-strip { order: 2; }
.cc-delta-strip { background: var(--bg-surface); border: 1px solid var(--border-subtle); border-radius: 12px; padding: 12px 16px; box-shadow: var(--elev-1); }
.cc-delta-head { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-soft); font-weight: 700; margin-bottom: 9px; }
.cc-delta-head i { color: var(--caretta-navy); margin-right: 5px; }
.cc-delta-head span { color: var(--text-faint); text-transform: none; letter-spacing: 0; font-weight: 600; }
.cc-delta-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.cc-delta-item { background: var(--bg-subtle); border-radius: 8px; padding: 9px 12px; }
.cc-delta-item .k { font-size: 0.72rem; color: var(--text-soft); }
.cc-delta-item .v { font-size: 1.1rem; font-weight: 700; color: var(--text-strong); line-height: 1.3; font-variant-numeric: tabular-nums; }
.cc-delta-item .d { font-size: 0.72rem; color: var(--text-faint); }
.cc-delta-up { color: var(--signal-on-track); }
.cc-delta-down { color: var(--signal-action); }


/* Faza 2d — Radar: ascund scurtaturile in-CC (redundante cu sidebar-ul 4 zone) */
#view-command-center > .cc-module-shortcuts { display: none; }


/* ============================================================
   FAZA 3 — HUB PARTENERI: comutator Carduri / Tabel + tabel dens
   O sursă, două vederi: aceleași date, altă prezentare.
   ============================================================ */
.crm-view-toggle {
    display: inline-flex; gap: 4px; padding: 4px; margin: 0 0 16px;
    background: var(--bg-subtle); border-radius: var(--r-pill, 999px);
}
.crm-view-toggle button {
    display: inline-flex; align-items: center; gap: 7px;
    border: 0; background: transparent; cursor: pointer;
    padding: 8px 16px; border-radius: var(--r-pill, 999px);
    font-weight: 600; font-size: 0.84rem; line-height: 1;
    color: var(--text-soft); transition: all 0.15s ease;
}
.crm-view-toggle button:hover { color: var(--text-strong); }
.crm-view-toggle button.is-active {
    background: var(--card-bg, #fff); color: var(--caretta-navy);
    box-shadow: var(--elev-1, 0 1px 3px rgba(0,0,0,.12));
}

.crm-table-wrap {
    background: var(--card-bg, #fff); border: 1px solid var(--border-subtle, #e7ecf3);
    border-radius: var(--r-lg, 14px); overflow: auto; max-height: 72vh;
    box-shadow: var(--elev-1, 0 1px 3px rgba(0,0,0,.06));
}
.crm-hub-table { width: 100%; border-collapse: collapse; font-size: 0.86rem; }
.crm-hub-table thead th {
    position: sticky; top: 0; z-index: 2;
    background: var(--caretta-navy); color: #fff;
    text-align: left; font-weight: 600; font-size: 0.74rem;
    letter-spacing: 0.03em; text-transform: uppercase;
    padding: 11px 14px; white-space: nowrap;
}
.crm-hub-table thead th.crm-hub-num { text-align: right; }
.crm-hub-table thead th.crm-hub-c { text-align: center; }
.crm-hub-table tbody td {
    padding: 10px 14px; border-top: 1px solid var(--border-subtle, #e7ecf3);
    color: var(--text-main); vertical-align: middle; white-space: nowrap;
}
.crm-hub-row { cursor: pointer; transition: background 0.12s ease; }
.crm-hub-row:hover { background: var(--bg-subtle); }
.crm-hub-name {
    font-weight: 600; color: var(--caretta-navy);
    max-width: 260px; overflow: hidden; text-overflow: ellipsis;
}
.crm-hub-num { text-align: right; font-variant-numeric: tabular-nums; }
.crm-hub-c { text-align: center; }
.crm-hub-num.is-alert { color: var(--signal-action); font-weight: 600; }

.crm-hub-score {
    display: inline-block; min-width: 30px; padding: 3px 8px;
    border-radius: var(--r-pill, 999px); font-weight: 700; font-size: 0.78rem; color: #fff;
}
.crm-hub-score.s-ok { background: var(--signal-on-track); }
.crm-hub-score.s-watch { background: var(--signal-watch); }
.crm-hub-score.s-bad { background: var(--signal-action); }

.crm-hub-risk {
    display: inline-block; padding: 3px 9px;
    border-radius: var(--r-pill, 999px); font-weight: 600; font-size: 0.74rem;
}
.crm-hub-risk.jr-low { background: #e5f5ec; color: #1f7a4d; }
.crm-hub-risk.jr-medium { background: #fff3e0; color: #a5670a; }
.crm-hub-risk.jr-high { background: #fdecea; color: #b3261e; }
.crm-hub-risk.jr-crit, .crm-hub-risk.jr-block { background: #b3261e; color: #fff; }
.crm-hub-risk.jr-review { background: #eef2f6; color: #5b6b7a; }

.crm-hub-status {
    display: inline-block; padding: 3px 9px;
    border-radius: var(--r-pill, 999px); font-weight: 600; font-size: 0.72rem;
    text-transform: uppercase; letter-spacing: 0.02em;
}
.crm-hub-status.is-active { background: #e5f5ec; color: #1f7a4d; }
.crm-hub-status.is-inactive { background: #f0f0f0; color: #7a7a7a; }
.crm-hub-status.is-prospect { background: #e7f0fb; color: #1d5fa8; }

/* Dark mode — toate rescoped sub body.dark-mode (zero impact pe light) */
body.dark-mode .crm-view-toggle { background: rgba(255,255,255,.06); }
body.dark-mode .crm-view-toggle button.is-active { background: var(--card-bg); color: #e6eef5; }
body.dark-mode .crm-table-wrap { background: var(--card-bg); border-color: rgba(255,255,255,.08); }
body.dark-mode .crm-hub-table tbody td { border-top-color: rgba(255,255,255,.06); }
body.dark-mode .crm-hub-name { color: #7fc4e8; }
body.dark-mode .crm-hub-row:hover { background: rgba(255,255,255,.04); }
body.dark-mode .crm-hub-risk.jr-low { background: rgba(46,158,107,.18); color: #6fd39b; }
body.dark-mode .crm-hub-risk.jr-medium { background: rgba(224,161,60,.18); color: #eabd6f; }
body.dark-mode .crm-hub-risk.jr-high { background: rgba(209,73,91,.18); color: #f0919e; }
body.dark-mode .crm-hub-risk.jr-review { background: rgba(255,255,255,.08); color: #9fb0bf; }
body.dark-mode .crm-hub-status.is-active { background: rgba(46,158,107,.18); color: #6fd39b; }
body.dark-mode .crm-hub-status.is-inactive { background: rgba(255,255,255,.08); color: #9fb0bf; }
body.dark-mode .crm-hub-status.is-prospect { background: rgba(29,95,168,.22); color: #8fbdf0; }


/* ============================================================
   FAZA 4 — CENTRUL DE DATE: Mapări + Verificare unite
   Un verdict (read-only) legat de ecranul de corecție prin „Rezolvă acum".
   ============================================================ */
/* Sidebar: Mapări ascuns — unificat sub „Centrul de Date" (accesibil prin sub-nav) */
#maparii-link { display: none; }

.dc-shell { margin-bottom: 18px; }
.dc-eyebrow {
    display: flex; align-items: center; gap: 7px;
    font-size: 0.74rem; font-weight: 700; letter-spacing: 0.08em;
    text-transform: uppercase; color: var(--caretta-red); margin-bottom: 10px;
}
.dc-subnav { display: inline-flex; flex-wrap: wrap; gap: 8px; }
.dc-tab {
    display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
    background: var(--card-bg, #fff); border: 1px solid var(--border-subtle, #e7ecf3);
    padding: 10px 18px; border-radius: 11px;
    font-weight: 600; font-size: 0.9rem; line-height: 1;
    color: var(--caretta-navy); transition: all 0.14s ease;
}
.dc-tab i { color: var(--caretta-red); font-size: 0.95em; }
.dc-tab:hover { border-color: var(--caretta-navy); box-shadow: 0 2px 9px rgba(0,0,0,.08); transform: translateY(-1px); }
.dc-tab.active {
    background: var(--caretta-navy); border-color: var(--caretta-navy); color: #fff;
    box-shadow: 0 3px 11px rgba(0,51,73,.24);
}
.dc-tab.active i { color: #fff; }
@media (max-width: 640px) {
    .dc-subnav { gap: 6px; }
    .dc-tab { padding: 9px 14px; font-size: 0.85rem; }
    .dc-eyebrow { margin-bottom: 8px; }
}

/* Verificare Date: CTA „Rezolvă în Mapări" pe verdict (împinsă la dreapta) */
.vd-fix-cta {
    display: inline-flex; align-items: center; gap: 7px;
    border: 0; cursor: pointer; margin-left: auto;
    padding: 8px 16px; border-radius: var(--r-pill, 999px);
    background: var(--caretta-navy); color: #fff;
    font-weight: 600; font-size: 0.85rem; transition: filter 0.15s ease;
}
.vd-fix-cta:hover { filter: brightness(1.18); }

/* Dark mode */
body.dark-mode .dc-tab { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.14); color: #cfe0ee; }
body.dark-mode .dc-tab:hover { border-color: #4a90b8; }
body.dark-mode .dc-tab.active { background: #0d5a78; border-color: #0d5a78; color: #fff; }
body.dark-mode .dc-tab.active i { color: #fff; }
body.dark-mode .dc-eyebrow { color: #ff5c8a; }


/* ============================================================
   FAZA 5 — PERFORMANȚĂ VÂNZĂRI aerisit: secțiuni + citează sursele + colaps
   „Ce aveam + mai mult, dar grupat" — nimic recalculat, nimic pierdut.
   ============================================================ */
.perf-section-head {
    display: flex; align-items: center; gap: 8px;
    font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em;
    text-transform: uppercase; color: var(--caretta-navy);
    margin: 22px 2px 12px;
}
.perf-section-head i { color: var(--caretta-red); }

.perf-cite-row { display: flex; flex-wrap: wrap; gap: 12px; margin: 4px 0 8px; }
.perf-cite {
    display: inline-flex; align-items: center; gap: 9px; cursor: pointer;
    border: 1px solid var(--border-subtle, #e7ecf3); background: var(--card-bg, #fff);
    border-radius: var(--r-lg, 12px); padding: 11px 16px;
    font-weight: 600; font-size: 0.86rem; color: var(--caretta-navy);
    transition: all 0.15s ease;
}
.perf-cite span { color: var(--text-soft); font-weight: 500; }
.perf-cite i { color: var(--caretta-red); }
.perf-cite:hover { border-color: var(--caretta-navy); box-shadow: var(--elev-1, 0 1px 3px rgba(0,0,0,.1)); transform: translateY(-1px); }

.perf-collapse > summary {
    cursor: pointer; font-size: 0.9rem; font-weight: 600; padding: 1rem;
    border-bottom: 1px solid var(--border-color); list-style: none;
    display: flex; align-items: center; gap: 9px; color: var(--caretta-navy);
}
.perf-collapse > summary::-webkit-details-marker { display: none; }
.perf-collapse > summary i { color: var(--caretta-red); }
.perf-collapse-hint { color: var(--text-soft); font-weight: 400; font-size: 0.78rem; margin-left: auto; }
.perf-collapse:not([open]) > summary { border-bottom: 0; }

/* Dark mode */
body.dark-mode .perf-section-head { color: #7fc4e8; }
body.dark-mode .perf-cite { background: var(--card-bg); border-color: rgba(255,255,255,.1); color: #e6eef5; }
body.dark-mode .perf-cite span { color: #9fb0bf; }
body.dark-mode .perf-cite:hover { border-color: #7fc4e8; }
body.dark-mode .perf-collapse > summary { color: #e6eef5; }


/* ============================================================
   FAZA 6 — HUB VIZITE: Rapoarte + Planificator + Dashboard unite
   Un singur „Vizite Parteneri" în sidebar; sub-nav (dc-*) comută între cele 3.
   ============================================================ */
#visit-planner-link,
#visits-dashboard-link { display: none; }


/* ============================================================
   FAZA 7 — Registru unit cu Hub Parteneri (navigație, NU contopire de date)
   Un singur „Hub Parteneri" în sidebar; sub-nav [Hub | Registru] comută.
   Ecranul Registru („Performanță individuală") rămâne intact — zero date pierdute.
   ============================================================ */
#sidebar-main a[data-target="view-partners"] { display: none; }


/* ============================================================
   FAZA 9 — Radar + Raport Zilnic unite sub „Azi" (sub-nav)
   Un singur „Activitate Zilnică" în sidebar; sub-nav comută cu Raportul Zilnic.
   ============================================================ */
#sidebar-main a[data-target="view-daily"] { display: none; }
#view-command-center > .dc-shell { order: 0; }   /* sub-nav înaintea heroului (order:1) */


/* ============================================================
   FAZA 10 — HUB PARTENERI: carduri redesign „Scor-first" (varianta B)
   Inel de scor + accent stânga pe sănătate + 2×2 metrici. Restul → „Detalii".
   ============================================================ */
.crmx-cardB {
    display: flex; overflow: hidden;
    background: var(--card-bg, #fff); border: 1px solid var(--border-subtle, #e7ecf3);
    border-radius: 14px; box-shadow: var(--elev-1, 0 1px 3px rgba(0,0,0,.06));
    transition: box-shadow .16s ease, transform .16s ease;
}
.crmx-cardB:hover { box-shadow: var(--elev-2, 0 8px 22px rgba(0,0,0,.10)); transform: translateY(-2px); }
.crmx-cardB.is-inactive { opacity: .92; }

.crmx-accent { width: 4px; flex-shrink: 0; background: var(--border-strong, #cbd5e1); }
.crmx-cardB.score-ok .crmx-accent { background: var(--signal-on-track, #10b981); }
.crmx-cardB.score-watch .crmx-accent { background: var(--signal-watch, #f59e0b); }
.crmx-cardB.score-action .crmx-accent { background: var(--signal-action, #ef4444); }

.crmx-bodyB { flex: 1; min-width: 0; padding: 15px 17px; display: flex; flex-direction: column; gap: 13px; }

.crmx-headB { display: flex; align-items: flex-start; gap: 12px; }
.crmx-headB .crmx-head-main { min-width: 0; flex: 1; }
.crmx-cardB .crmx-name { font-size: 1rem; font-weight: 700; color: var(--caretta-navy); margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.25; }
.crmx-subB { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 6px; font-size: 0.78rem; }
.crmx-region { color: var(--text-soft); }
.crmx-cardB .crmx-status { display: inline-flex; align-items: center; gap: 4px; background: transparent; border: 0; padding: 0; font-size: 0.72rem; font-weight: 600; }
.crmx-cardB .crmx-status.is-active { color: var(--signal-on-track, #10b981); }
.crmx-cardB .crmx-status.is-inactive { color: var(--text-faint, #94a3b8); }
.crmx-cardB .crmx-status.is-prospect { color: #1d5fa8; }

.crmx-ring {
    width: 48px; height: 48px; flex-shrink: 0; border-radius: 50%; padding: 0;
    border: 3px solid var(--border-strong, #cbd5e1); background: transparent; cursor: pointer;
    display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1;
    transition: transform .12s ease;
}
.crmx-ring:hover { transform: scale(1.07); }
.crmx-ring b { font-size: 1.05rem; font-weight: 700; color: var(--text-strong); }
.crmx-ring small { font-size: 0.54rem; color: var(--text-faint); text-transform: uppercase; letter-spacing: .04em; margin-top: 1px; }
.crmx-ring.t-ok { border-color: var(--signal-on-track, #10b981); }
.crmx-ring.t-watch { border-color: var(--signal-watch, #f59e0b); }
.crmx-ring.t-action { border-color: var(--signal-action, #ef4444); }

.crmx-metricsB { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.crmx-mB { background: var(--bg-subtle, #f5f8fb); border-radius: 10px; padding: 9px 11px; min-width: 0; }
.crmx-mB-l { display: block; font-size: 0.72rem; color: var(--text-soft); }
.crmx-mB-v { display: block; font-size: 0.98rem; font-weight: 700; color: var(--text-strong); margin-top: 2px; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crmx-mB-v small { font-size: 0.7rem; font-weight: 500; color: var(--text-soft); }
.crmx-mB.is-alert .crmx-mB-v { color: var(--signal-action, #ef4444); }
.crmx-none { color: var(--text-faint, #94a3b8); font-weight: 500; font-size: 0.86rem; }

.crmx-footB { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.crmx-footB-info { display: flex; align-items: center; gap: 9px; min-width: 0; font-size: 0.75rem; color: var(--text-soft); }
.crmx-footB-loc { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crmx-footB-loc i { margin-right: 3px; opacity: .7; }
.crmx-riskchip { border: 0; cursor: pointer; font-size: 0.72rem; font-weight: 600; padding: 3px 9px; border-radius: 999px; white-space: nowrap; flex-shrink: 0; }
.crmx-riskchip.jr-low { background: #e5f5ec; color: #1f7a4d; }
.crmx-riskchip.jr-medium { background: #fff3e0; color: #a5670a; }
.crmx-riskchip.jr-high { background: #fdecea; color: #b3261e; }
.crmx-riskchip.jr-crit, .crmx-riskchip.jr-block { background: #b3261e; color: #fff; }
.crmx-riskchip.jr-review { background: #eef2f6; color: #5b6b7a; }
.crmx-cardB .crmx-actions { display: flex; gap: 6px; flex-shrink: 0; }
.crmx-cardB .crmx-details { margin-top: 2px; }

/* Dark mode */
body.dark-mode .crmx-cardB { background: var(--card-bg); border-color: rgba(255,255,255,.08); }
body.dark-mode .crmx-cardB .crmx-name { color: #7fc4e8; }
body.dark-mode .crmx-mB { background: rgba(255,255,255,.05); }
body.dark-mode .crmx-riskchip.jr-low { background: rgba(46,158,107,.18); color: #6fd39b; }
body.dark-mode .crmx-riskchip.jr-medium { background: rgba(224,161,60,.18); color: #eabd6f; }
body.dark-mode .crmx-riskchip.jr-high { background: rgba(209,73,91,.18); color: #f0919e; }
body.dark-mode .crmx-riskchip.jr-review { background: rgba(255,255,255,.08); color: #9fb0bf; }


/* ============================================================
   FAZA 11 — ascundere butoane „Actualizare date" + fix buton navy + picker Juridic
   ============================================================ */
/* 1. Sidebar: ascund panoul „Actualizare date" (btn-auto-load = importul; Daniel nu-l mai folosește) */
#sync-panel { display: none; }

/* 2. Reîncarcă & butoanele din antetul navy Marketing/Expozoare/Juridic → lizibile pe navy */
.mkt-hero .upload-btn,
.mkt-hero .upload-btn.secondary-btn {
    background: rgba(255, 255, 255, 0.14) !important;
    border: 1px solid rgba(255, 255, 255, 0.30) !important;
    color: #fff !important;
}
.mkt-hero .upload-btn:hover,
.mkt-hero .upload-btn.secondary-btn:hover {
    background: rgba(255, 255, 255, 0.24) !important;
    border-color: rgba(255, 255, 255, 0.45) !important;
}
.mkt-hero .upload-btn i { color: #fff !important; }

/* 3. Juridic — picker „Generează raport de risc" (căutare partener din Hub → openReport) */
.jr-gen-picker { position: relative; max-width: 480px; }
.jr-gen-picker .jr-gen-ico { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--text-soft); pointer-events: none; }
.jr-gen-picker input {
    width: 100%; padding: 11px 14px 11px 38px; border-radius: 10px;
    border: 1px solid var(--border-subtle, #e7ecf3); background: var(--card-bg, #fff);
    color: var(--text-strong); font-size: 0.92rem;
}
.jr-gen-picker input:focus { outline: none; border-color: var(--caretta-navy); box-shadow: 0 0 0 3px rgba(0,51,73,.1); }
.jr-gen-results {
    display: none; position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 6px);
    background: var(--card-bg, #fff); border: 1px solid var(--border-subtle, #e7ecf3);
    border-radius: 11px; box-shadow: var(--elev-2, 0 8px 24px rgba(0,0,0,.14)); overflow: hidden;
}
.jr-gen-results.is-open { display: block; }
.jr-gen-item {
    display: flex; flex-direction: column; gap: 2px; width: 100%; text-align: left;
    border: 0; background: transparent; cursor: pointer; padding: 10px 14px;
    border-bottom: 1px solid var(--border-subtle, #eef2f6);
}
.jr-gen-item:last-child { border-bottom: 0; }
.jr-gen-item:hover { background: var(--bg-subtle, #f5f8fb); }
.jr-gen-item b { font-weight: 600; font-size: 0.9rem; color: var(--caretta-navy); }
.jr-gen-item small { color: var(--text-soft); font-size: 0.78rem; }
.jr-gen-empty { padding: 12px 14px; color: var(--text-soft); font-size: 0.86rem; }

body.dark-mode .jr-gen-picker input { background: var(--card-bg); border-color: rgba(255,255,255,.12); }
body.dark-mode .jr-gen-results { background: var(--card-bg); border-color: rgba(255,255,255,.12); }
body.dark-mode .jr-gen-item { border-bottom-color: rgba(255,255,255,.07); }
body.dark-mode .jr-gen-item b { color: #7fc4e8; }
body.dark-mode .jr-gen-item:hover { background: rgba(255,255,255,.05); }


/* ============================================================
   FAZA 12 — fixuri UI (batch Daniel): Încasări navy · picker Juridic premium · buton vizite sus
   ============================================================ */
/* Item 1 — benzile navy report-toolbar: subtitlul avea gri inline (color:var(--text-muted)) → ilizibil pe navy */
.dashboard-view .report-toolbar h3,
.dashboard-view .report-toolbar .card-title { color: #fff !important; }
.dashboard-view .report-toolbar p { color: rgba(255,255,255,.78) !important; }

/* Item 4 — buton „Raport vizită" adus sus lângă sub-nav (nu mai e îngropat sub AI Insights) */
.vh-shell { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.vh-new-btn { background: var(--caretta-red) !important; color: #fff !important; border: none !important; align-self: center; box-shadow: 0 2px 8px rgba(224,0,77,.25); }
.vh-new-btn:hover { filter: brightness(1.08); }
.vh-new-btn i { color: #fff !important; }

/* Item 6 — picker „Generează raport de risc" → card navy premium (aici e adevăratul modul de risc) */
.jr-gen { background: var(--caretta-navy) !important; border: none !important; box-shadow: var(--elev-2); }
.jr-gen-head { display: flex; align-items: center; gap: 14px; margin-bottom: 15px; }
.jr-gen-icon { width: 46px; height: 46px; flex-shrink: 0; border-radius: 12px; background: var(--caretta-red); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; }
.jr-gen-head h3 { margin: 0; color: #fff; font-size: 1.1rem; font-weight: 700; }
.jr-gen-head p { margin: 3px 0 0; color: rgba(255,255,255,.72); font-size: 0.86rem; }
.jr-gen .jr-gen-picker { max-width: none; }
.jr-gen .jr-gen-picker .jr-gen-ico { color: var(--caretta-navy); }
.jr-gen .jr-gen-picker input { padding: 13px 14px 13px 42px; border-radius: 11px; border: 1px solid rgba(255,255,255,.25); background: #fff; color: #1f2937; font-size: 0.95rem; }
.jr-gen .jr-gen-picker input::placeholder { color: #8a99a8; }
.jr-gen .jr-gen-picker input:focus { border-color: var(--caretta-red); box-shadow: 0 0 0 3px rgba(224,0,77,.18); }
body.dark-mode .jr-gen .jr-gen-picker input { background: #fff; color: #1f2937; }


/* ============================================================
   FAZA 13 — scot „Industriale vs rezidențiale" + banner sync mutat discret în sidebar
   ============================================================ */
/* Item 3 — butonul „Industriale vs rezidențiale" din Radar (nu ajută) */
#cc-toggle-breakdown { display: none; }

/* Item 1 — banner sync mutat în sidebar-footer → compact + discret (jos, unde erau butoanele vechi) */
.sidebar-footer .source-sync-status {
    background: none; border: none; box-shadow: none;
    padding: 0 0 8px; margin: 0 0 8px;
    border-bottom: 1px solid var(--border-subtle, #e7ecf3);
    display: flex; flex-direction: column; align-items: flex-start; gap: 5px; width: 100%;
}
.sidebar-footer .source-sync-main {
    display: flex; align-items: flex-start; gap: 6px;
    font-size: 0.7rem; color: var(--text-soft); line-height: 1.35; text-align: left;
}
.sidebar-footer .source-sync-toggle {
    font-size: 0.68rem; padding: 0; background: none; border: 0;
    color: var(--text-faint, #94a3b8); cursor: pointer; text-decoration: underline;
}
.sidebar-footer .source-sync-events { font-size: 0.66rem; margin: 2px 0 0; padding-left: 14px; max-height: 130px; overflow-y: auto; }
body.dark-mode .sidebar-footer .source-sync-status { border-bottom-color: rgba(255,255,255,.08); }


/* ============================================================
   FAZA 14 — scot banda navy „Activitate Zilnică / Vedere completă" din Radar
   Redundantă: titlul e sus, chip-urile perioadă/clasă/regiune = filtrele de deasupra,
   iar regiunea/perioada apar din nou în verdictul de dedesubt.
   ============================================================ */
#view-command-center .cc-hero--header { display: none; }
