/* =========================================================================
   Financial Dashboard — premium SaaS re-skin (v10 edition)
   Override layer for the embedded Fiscal.ai Svelte bundle. Scoped under
   #csi-financial-dashboard-app so the ID outranks the bundle's .svelte-*
   rules — robust across bundle re-syncs. Uses v10 tokens, so it also
   adapts to light mode. The shared bundle file is never modified.
   ========================================================================= */

/* ── Mount wrapper ───────────────────────────────────────────────────────── */
.fin-app-wrap{
  border:none;border-radius:var(--r6);overflow:hidden;
  background:transparent;
}
#csi-financial-dashboard-app{
  width:100%;min-height:0;font-family:'Spectral',serif;
  color:var(--t1);background:transparent;
}
/* Svelte bundle sets main { min-height:100vh } — kill it in the iframe context */
#csi-financial-dashboard-app main{
  background:transparent !important;
  min-height:0 !important;
  padding:0 !important;
}

/* ── Layout container ────────────────────────────────────────────────────── */
#csi-financial-dashboard-app .dashboard-container{max-width:100%;margin:0;padding:0}
#csi-financial-dashboard-app .dashboard-search{max-width:680px;margin:8px auto 36px;text-align:center}

/* ── View toggle (Single / Multi-Company) — premium segmented control ────── */
#csi-financial-dashboard-app .view-toggle{
  display:inline-flex;gap:3px;padding:4px;border:1px solid var(--border);
  border-radius:var(--r4);background:var(--bg-elevated);overflow:visible;
  margin-bottom:8px;
}
#csi-financial-dashboard-app .view-toggle button{
  border:none;background:transparent;color:var(--t2);
  font-size:12px;font-weight:600;padding:8px 18px;border-radius:var(--r3);
  cursor:pointer;transition:color var(--t-fast),background var(--t-fast);
}
#csi-financial-dashboard-app .view-toggle button:hover{color:var(--t1)}
#csi-financial-dashboard-app .view-toggle button.active,
#csi-financial-dashboard-app .view-toggle button.selected,
#csi-financial-dashboard-app .view-toggle button.toggle-active{
  background:var(--green);color:#04140a;box-shadow:0 2px 10px var(--green-glow);
}

/* ── Search heading ──────────────────────────────────────────────────────── */
#csi-financial-dashboard-app .search-title{
  color:var(--t1);font-size:26px;font-weight:700;letter-spacing:-.3px;margin-bottom:8px;
}
#csi-financial-dashboard-app .search-subtitle{
  color:var(--t3);font-size:13px;font-weight:500;margin-bottom:20px;
}

/* ── Search box ──────────────────────────────────────────────────────────── */
#csi-financial-dashboard-app .search-container{
  background:var(--bg-input);border:1px solid var(--border);border-radius:var(--r4);
  padding:5px 5px 5px 14px;box-shadow:none;
  transition:border-color var(--t-fast),box-shadow var(--t-fast);
}
#csi-financial-dashboard-app .search-container:focus-within{
  border-color:var(--border-green);box-shadow:0 0 0 3px var(--green-dim);
}
#csi-financial-dashboard-app .search-container input{
  background:transparent !important;border:none !important;color:var(--t1) !important;
  font-size:14px;padding:9px 6px !important;
}
#csi-financial-dashboard-app .search-container input::placeholder{color:var(--t3)}
#csi-financial-dashboard-app .search-container button{
  background:var(--green) !important;color:#04140a !important;border:none !important;
  border-radius:var(--r3) !important;font-weight:700;font-size:12px;padding:9px 18px !important;
  transition:background var(--t-fast),transform var(--t-fast);
}
#csi-financial-dashboard-app .search-container button:hover{background:var(--green-bright) !important;transform:translateY(-1px)}

/* ── Search dropdown ─────────────────────────────────────────────────────── */
#csi-financial-dashboard-app .search-dropdown{
  background:var(--bg-sidebar);border:1px solid var(--border-hv);border-radius:var(--r4);
  box-shadow:0 18px 50px -12px rgba(0,0,0,.6);margin-top:6px;
}
#csi-financial-dashboard-app .dropdown-item{padding:11px 14px;transition:background var(--t-fast)}
#csi-financial-dashboard-app .dropdown-item:hover,
#csi-financial-dashboard-app .dropdown-item.selected,
#csi-financial-dashboard-app .dropdown-item.active{background:var(--bg-elevated)}
#csi-financial-dashboard-app .item-name{color:var(--t1);font-size:13px;font-weight:600}
#csi-financial-dashboard-app .item-meta{color:var(--green-text);font-size:11px;font-weight:700;letter-spacing:.03em}

/* ── Company profile card ────────────────────────────────────────────────── */
#csi-financial-dashboard-app .company-description{
  width:100% !important;max-width:none;margin:24px 0 0;
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r5);
  padding:var(--s6);color:var(--t2);font-size:14px;line-height:1.7;
  background-image:linear-gradient(180deg,rgba(255,255,255,.025) 0%,rgba(255,255,255,0) 40%);
  box-shadow:0 14px 34px -18px rgba(0,0,0,.75);
}
#csi-financial-dashboard-app .company-name{color:var(--t1);font-size:22px;font-weight:700;letter-spacing:-.3px;margin:0 0 4px}
#csi-financial-dashboard-app .stock-price,
#csi-financial-dashboard-app .market-cap{color:var(--green-text);font-size:18px;font-weight:800;font-variant-numeric:tabular-nums}

/* ── Sticky tab bar ──────────────────────────────────────────────────────── */
#csi-financial-dashboard-app .sticky-tabs{
  position:sticky;top:56px;z-index:20;padding:14px 0;
  background:var(--bg);border-bottom:1px solid var(--border);box-shadow:none;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
body.light #csi-financial-dashboard-app .sticky-tabs{background:var(--bg)}

/* ── Tab + control pills (radio groups) ─────────────────────────────────── */
#csi-financial-dashboard-app .radio-group-parent{gap:10px;flex-wrap:wrap;justify-content:center}
#csi-financial-dashboard-app .radio-group{
  display:inline-flex;gap:3px;padding:3px;border:1px solid var(--border);
  border-radius:var(--r4);background:var(--bg-elevated);
}
#csi-financial-dashboard-app .radio-group label{
  background:transparent;color:var(--t2);border:none;
  font-size:12px;font-weight:600;padding:7px 14px;border-radius:var(--r3);
  cursor:pointer;transition:color var(--t-fast),background var(--t-fast);white-space:nowrap;
}
#csi-financial-dashboard-app .radio-group label:hover{color:var(--t1)}
#csi-financial-dashboard-app .radio-group input[type=radio]:checked + label{
  background:var(--green-dim);color:var(--green);box-shadow:inset 0 0 0 1px var(--border-green);
}

/* ── Financial statement tables ──────────────────────────────────────────── */
#csi-financial-dashboard-app .scroll-container{
  border:1px solid var(--border);border-radius:var(--r5);overflow:auto;
  background:var(--bg-card);
}
#csi-financial-dashboard-app table{border-collapse:collapse;width:100%;font-size:12px}
#csi-financial-dashboard-app thead th{
  background:rgba(255,255,255,.025);color:var(--t3);
  font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  border:none;border-bottom:1px solid var(--border);padding:10px 12px;white-space:nowrap;
  position:sticky;top:0;
}
body.light #csi-financial-dashboard-app thead th{background:rgba(15,25,45,.03)}
#csi-financial-dashboard-app tbody td{
  color:var(--t2);border:none;border-bottom:1px solid var(--border);
  padding:9px 12px;font-variant-numeric:tabular-nums;white-space:nowrap;
}
#csi-financial-dashboard-app tbody tr:last-child td{border-bottom:none}
#csi-financial-dashboard-app tbody tr{background:transparent !important;transition:background var(--t-fast)}
#csi-financial-dashboard-app tbody tr:hover{background:rgba(255,255,255,.03) !important}
body.light #csi-financial-dashboard-app tbody tr:hover{background:rgba(15,25,45,.03) !important}
#csi-financial-dashboard-app td.row-label,
#csi-financial-dashboard-app tbody td:first-child{color:var(--t1);font-weight:600;position:sticky;left:0;background:var(--bg-card)}
#csi-financial-dashboard-app input[type=checkbox]{accent-color:var(--green)}

/* ── Stat / ratio cards ──────────────────────────────────────────────────── */
#csi-financial-dashboard-app .stats-grid{gap:var(--s4);margin-bottom:var(--s6)}
#csi-financial-dashboard-app .stat-card{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r5);
  padding:var(--s5);transition:border-color var(--t-fast),box-shadow var(--t-fast);
  box-shadow:0 14px 34px -18px rgba(0,0,0,.7);
}
#csi-financial-dashboard-app .stat-card:hover{border-color:var(--border-green);box-shadow:0 0 0 1px var(--border-green)}
body.light #csi-financial-dashboard-app .stat-card{box-shadow:0 8px 20px rgba(15,25,45,.14), 0 3px 8px rgba(15,25,45,.09), 0 1px 0 rgba(255,255,255,.7) inset}
#csi-financial-dashboard-app .stat-label{color:var(--t3);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em}
#csi-financial-dashboard-app .stat-value{color:var(--t1);font-size:24px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1}
#csi-financial-dashboard-app .stat-sub{color:var(--t3);font-size:11px}

/* ── DCF calculator ──────────────────────────────────────────────────────── */
#csi-financial-dashboard-app .dcf-container{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r5);
  padding:var(--s6);color:var(--t1);max-width:820px;
}
#csi-financial-dashboard-app .dcf-label{color:var(--t2);font-weight:600;font-size:13px}
#csi-financial-dashboard-app .dcf-stock-info{background:var(--bg-elevated);border-radius:var(--r4);color:var(--t2)}
#csi-financial-dashboard-app .dcf-slider{accent-color:var(--green)}
#csi-financial-dashboard-app .dcf-text-input,
#csi-financial-dashboard-app input.svelte-nrloui{
  background:var(--bg-input) !important;border:1px solid var(--border) !important;
  border-radius:var(--r3) !important;color:var(--t1) !important;font-variant-numeric:tabular-nums;
}
#csi-financial-dashboard-app .dcf-text-input:focus{border-color:var(--border-green) !important;box-shadow:0 0 0 3px var(--green-dim)}
#csi-financial-dashboard-app .dcf-result{
  background:linear-gradient(135deg,var(--green-dim),rgba(45,212,191,.03)) !important;
  border:1px solid var(--border-green);border-radius:var(--r5);color:var(--green) !important;
  font-variant-numeric:tabular-nums;
}

/* ── Charts ──────────────────────────────────────────────────────────────── */
#csi-financial-dashboard-app .chart-section,
#csi-financial-dashboard-app .chart-container,
#csi-financial-dashboard-app .chart-wrapper{background:transparent}
#csi-financial-dashboard-app .chart-title,
#csi-financial-dashboard-app .section-title{color:var(--t1);font-weight:700}
#csi-financial-dashboard-app .chart-controls{
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r5);
}
#csi-financial-dashboard-app .chart-controls h3{color:var(--t3);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
#csi-financial-dashboard-app .chart-control-label{color:var(--t1);font-size:12px}
#csi-financial-dashboard-app .chart-control-source{color:var(--t3);font-size:10px}
#csi-financial-dashboard-app .chart-control-toggle button{
  background:var(--bg-elevated);color:var(--t2);border:1px solid var(--border);
  border-radius:var(--r2);font-size:11px;font-weight:600;padding:5px 10px;transition:all var(--t-fast);
}
#csi-financial-dashboard-app .chart-control-toggle button.active{
  background:var(--green-dim);color:var(--green);border-color:var(--border-green);
}
#csi-financial-dashboard-app .chart-control-toggle button.remove{
  background:var(--red-dim);color:var(--red);border-color:rgba(244,86,106,.3);
}
#csi-financial-dashboard-app .legend-label{color:var(--t2);font-size:11px}

/* ── Multi-company chips ─────────────────────────────────────────────────── */
#csi-financial-dashboard-app .chip{
  background:var(--green-dim);color:var(--green);border:1px solid var(--border-green);
  border-radius:var(--rpill);font-size:11px;font-weight:700;padding:3px 10px;
}
#csi-financial-dashboard-app .chip-remove{color:var(--green);opacity:.7}
#csi-financial-dashboard-app .chip-remove:hover{opacity:1}

/* ── Misc: credits, loading, empty ───────────────────────────────────────── */
#csi-financial-dashboard-app .credits,
#csi-financial-dashboard-app .loading,
#csi-financial-dashboard-app .empty,
#csi-financial-dashboard-app .empty-state{color:var(--t3)}
#csi-financial-dashboard-app .credits-link{color:var(--green-text)}
#csi-financial-dashboard-app .error{color:var(--red)}

/* ── View-panel tab switching — explicit enforcement ─────────────────────── */
/* The Svelte scoped rule .view-panel.svelte-ljvqa3{display:none} can lose to
   cascade order in the v10 embedding context. Use ID specificity to guarantee
   inactive panels are hidden and the active one is shown. */
#csi-financial-dashboard-app .view-panel:not(.active){display:none !important}
#csi-financial-dashboard-app .view-panel.active{display:block !important}
