/* ============================================================
   CARETTA — Compunere Bonus (redesign 2026-07): condus de
   filtrele globale; segmented Încasări|Facturi; banner sumar;
   tabele profesionale (cap sticky, sortare, pondere).
   Tokens cu fallback => coerent light + dark.
   ============================================================ */

/* ---- Antet modul: titlu + segmented control ---- */
.cb-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.cb-head-title h3 { margin: 0 0 4px; }
.cb-head-title p { margin: 0; color: var(--text-soft, #6b7280); font-size: var(--fs-small, .84rem); max-width: 640px; }
.cb-head-title p b { color: var(--text-default, #1f2937); }

.cb-controls { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cb-year-wrap { display: inline-flex; align-items: center; gap: 8px; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .5px; color: var(--text-soft, #6b7280); }
.cb-year {
    padding: 8px 10px; border: 1px solid var(--border-subtle, #e7ecf3); border-radius: var(--r-md, 10px);
    background: var(--bg-surface, #fff); color: var(--text-default, #1f2937);
    font-family: inherit; font-size: .82rem; font-weight: 700; cursor: pointer;
}
.cb-year:focus { outline: none; border-color: var(--caretta-navy, #003349); box-shadow: 0 0 0 3px rgba(0, 51, 73, .12); }
.cb-seg { display: inline-flex; background: var(--bg-subtle, #f1f4f9); border: 1px solid var(--border-subtle, #e7ecf3); border-radius: var(--r-pill, 999px); padding: 4px; gap: 4px; flex: none; }
.cb-seg-btn {
    display: inline-flex; align-items: center; gap: 9px;
    border: none; background: transparent; cursor: pointer;
    padding: 8px 18px; border-radius: var(--r-pill, 999px);
    font-family: inherit; font-size: .84rem; font-weight: 700;
    color: var(--text-soft, #6b7280); transition: background .15s, color .15s, box-shadow .15s;
}
.cb-seg-btn i { font-size: .95rem; }
.cb-seg-btn span { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.15; }
.cb-seg-btn small { font-size: .64rem; font-weight: 600; opacity: .75; text-transform: none; letter-spacing: .2px; }
.cb-seg-btn:hover { color: var(--text-default, #1f2937); }
.cb-seg-btn.active { background: var(--caretta-navy, #003349); color: #fff; box-shadow: 0 2px 8px rgba(0, 51, 73, .28); }
.cb-seg-btn.active small { opacity: .8; }

/* ---- Butoane modul ---- */
.cb-btn {
    display: inline-flex; align-items: center; gap: 8px;
    border: 1px solid var(--border-subtle, #e7ecf3); border-radius: var(--r-md, 10px);
    background: var(--bg-surface, #fff); color: var(--text-default, #1f2937);
    font-family: inherit; font-size: .8rem; font-weight: 700;
    padding: 8px 14px; cursor: pointer; transition: background .15s, border-color .15s, color .15s;
    white-space: nowrap;
}
.cb-btn:hover { border-color: var(--caretta-navy, #003349); color: var(--caretta-navy, #003349); }
.cb-btn:disabled { opacity: .6; cursor: default; }
.cb-btn-export { background: var(--caretta-navy, #003349); border-color: var(--caretta-navy, #003349); color: #fff; }
.cb-btn-export:hover { background: #00475f; color: #fff; }
.cb-btn-export i { color: #7ee2a8; }
.cb-btn-ghost { border-style: dashed; }

/* ---- Banner sumar ---- */
.cb-hero {
    display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
    padding: 16px 18px; margin: 2px 0 16px;
    background: linear-gradient(135deg, var(--caretta-navy, #003349), #00475f);
    border-radius: var(--r-lg, 14px); color: #fff;
    box-shadow: 0 6px 18px rgba(0, 51, 73, .22);
}
.cb-hero-ic {
    width: 46px; height: 46px; border-radius: 12px; flex: none;
    display: flex; align-items: center; justify-content: center;
    background: rgba(255, 255, 255, .12); font-size: 1.15rem; color: #ffd97a;
}
.cb-hero-main { min-width: 220px; }
.cb-hero-label { font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .8px; opacity: .8; }
.cb-hero-value { font-size: 1.7rem; font-weight: 800; line-height: 1.15; letter-spacing: .3px; }
.cb-hero-value span { font-size: .85rem; font-weight: 700; opacity: .75; }
.cb-hero-meta { display: flex; gap: 8px; flex-wrap: wrap; flex: 1; }
.cb-chip {
    display: inline-flex; align-items: center; gap: 7px;
    background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .18);
    border-radius: var(--r-pill, 999px); padding: 5px 12px;
    font-size: .74rem; font-weight: 700; white-space: nowrap;
}
.cb-chip i { opacity: .8; }
.cb-hero .cb-btn-export { background: #fff; border-color: #fff; color: var(--caretta-navy, #003349); }
.cb-hero .cb-btn-export:hover { background: #eef4f8; }
.cb-hero .cb-btn-export i { color: #1a7f37; }

/* ---- Tabele ---- */
.cb-table-wrap { border: 1px solid var(--border-subtle, #e7ecf3); border-radius: var(--r-lg, 14px); overflow: auto; background: var(--bg-surface, #fff); }
.cb-table-tall { max-height: 62vh; }
.cb-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .82rem; }
.cb-table thead th {
    position: sticky; top: 0; z-index: 2;
    background: var(--caretta-navy, #003349); color: #fff;
    font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .6px;
    padding: 11px 14px; text-align: left; white-space: nowrap;
    border-bottom: 2px solid rgba(255, 255, 255, .15);
}
.cb-th-num, .cb-td-num { text-align: right !important; }
.cb-th-sort { cursor: pointer; user-select: none; }
.cb-th-sort:hover { background: #00425a; }
.cb-th-sort i { margin-left: 4px; color: #ffd97a; }
.cb-table tbody td { padding: 10px 14px; border-bottom: 1px solid var(--border-subtle, #eef1f6); color: var(--text-default, #1f2937); vertical-align: middle; }
.cb-table tbody tr:nth-child(even) td { background: var(--bg-surface-hover, #fafbfd); }
.cb-table tbody tr:last-child td { border-bottom: none; }
.cb-td-strong { font-weight: 700; }
.cb-td-date { white-space: nowrap; font-variant-numeric: tabular-nums; }
.cb-td-sum { font-weight: 800; font-variant-numeric: tabular-nums; color: var(--caretta-navy, #003349); }
.cb-td-region { font-weight: 800; color: var(--text-strong, #0f172a); white-space: nowrap; }

/* Overview: rând clicabil + pondere */
.cb-row-drill { cursor: pointer; }
.cb-row-drill:hover td { background: var(--bg-subtle, #eef4f8) !important; }
.cb-row-drill:focus { outline: 2px solid var(--caretta-navy, #003349); outline-offset: -2px; }
.cb-td-go { width: 34px; text-align: center; color: var(--text-soft, #9aa4b2); }
.cb-row-drill:hover .cb-td-go { color: var(--caretta-navy, #003349); }
.cb-th-share { min-width: 220px; }
.cb-share { position: relative; display: flex; align-items: center; gap: 10px; min-width: 200px; }
.cb-share-bar { height: 8px; border-radius: 6px; background: linear-gradient(90deg, var(--caretta-navy, #003349), #2f7ea6); min-width: 2px; flex: none; transition: width .25s; }
.cb-share-pct { font-size: .72rem; font-weight: 700; color: var(--text-soft, #6b7280); font-variant-numeric: tabular-nums; }

/* ---- Bara detaliului: înapoi + titlu + căutare + export ---- */
.cb-detail-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 4px 0 12px; }
.cb-detail-title { margin: 0; font-size: 1rem; color: var(--text-strong, #0f172a); display: flex; align-items: center; gap: 10px; }
.cb-count-chip {
    font-size: .7rem; font-weight: 800; color: var(--caretta-navy, #003349);
    background: var(--bg-subtle, #eef4f8); border: 1px solid var(--border-subtle, #dbe6ee);
    border-radius: var(--r-pill, 999px); padding: 3px 10px; white-space: nowrap;
}
.cb-search-box {
    flex: 1; min-width: 240px; max-width: 460px; position: relative;
    display: flex; align-items: center; gap: 8px;
}
.cb-search-box i { position: absolute; left: 12px; color: var(--text-soft, #9aa4b2); font-size: .8rem; pointer-events: none; }
.cb-search-box input {
    width: 100%; padding: 9px 12px 9px 34px;
    border: 1px solid var(--border-subtle, #d0d5dd); border-radius: var(--r-md, 10px);
    background: var(--bg-surface, #fff); color: var(--text-default, #1f2937);
    font-family: inherit; font-size: .82rem;
}
.cb-search-box input:focus { outline: none; border-color: var(--caretta-navy, #003349); box-shadow: 0 0 0 3px rgba(0, 51, 73, .12); }
#cb-search-info { position: absolute; right: 12px; font-size: .72rem; color: var(--text-soft, #6b7280); pointer-events: none; }
.cb-note { margin: 8px 2px 0; font-size: .76rem; color: var(--text-soft, #6b7280); }
.cb-note i { color: var(--caretta-navy, #003349); margin-right: 4px; }

/* ---- Responsive ---- */
@media (max-width: 760px) {
    .cb-head { flex-direction: column; }
    .cb-controls { width: 100%; }
    .cb-seg { flex: 1; }
    .cb-seg-btn { flex: 1; justify-content: center; }
    .cb-hero-meta { width: 100%; }
    .cb-th-share { min-width: 120px; }
    .cb-share { min-width: 110px; }
    .cb-share-pct { display: none; }
}

/* ---- DARK [cb]: navy-ul (#003349) folosit ca TEXT devine ilizibil pe suprafețe dark →
   remap la navy-ul deschis folosit de temă (#7db8d4, vezi premium-theme.css DARK).
   Navy-ul ca FUNDAL (hero, thead, segment activ, export) rămâne — are text alb. ---- */
body.dark-mode .cb-td-sum,
body.dark-mode .cb-count-chip,
body.dark-mode .cb-note i,
body.dark-mode .cb-year-wrap { color: #7db8d4; }
body.dark-mode .cb-btn:hover { color: #7db8d4; border-color: #7db8d4; }
body.dark-mode .cb-btn-export:hover { color: #fff; border-color: var(--caretta-navy, #003349); }
body.dark-mode .cb-hero .cb-btn-export:hover { color: var(--caretta-navy, #003349); border-color: #fff; }
body.dark-mode .cb-row-drill:hover .cb-td-go { color: #7db8d4; }
body.dark-mode .cb-row-drill:focus { outline-color: #7db8d4; }
body.dark-mode .cb-search-box input:focus,
body.dark-mode .cb-year:focus { border-color: #7db8d4; box-shadow: 0 0 0 3px rgba(125, 184, 212, .18); }
body.dark-mode .cb-td-region { color: var(--text-strong, #e8eef4); }
body.dark-mode .cb-share-bar { background: linear-gradient(90deg, #2f7ea6, #7db8d4); }