/* Company Financials tab (static/js/financials.js). Built on the shared ReN
   theme (static/css/ren-theme.css): tokens, cards, tables and buttons come
   from there; this file holds only the pieces specific to this tab. */

.fin-root { margin-bottom: 40px; }

/* Company Profile: collapsible heading over the description box */
.fin-profile { display: flex; flex-direction: column; gap: 10px; }
.fin-profile-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

/* Page Download (ReN-frontend's header Download button): select cards, then
   "Download as XLSX". */
.fin-toolbar { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-left: auto; }
.fin-dl-hint { font-size: var(--ren-fs-sm); color: var(--ren-text-muted); }
.fin-dl-wrap { position: relative; }
.fin-dl-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; font: inherit; font-size: var(--ren-fs-sm); font-weight: 500;
  border-radius: 8px; border: 1px solid var(--ren-primary-800); background: transparent; color: var(--ren-primary-800); cursor: pointer;
}
html[data-theme="dark"] .fin-dl-btn { color: #7aa2ff; border-color: #7aa2ff; }
.fin-dl-btn:hover, .fin-dl-btn.active { background: rgba(67, 105, 244, 0.1); }
.fin-dl-btn .ren-ico-14 { width: 16px; height: 16px; }
.fin-dl-menu {
  position: absolute; top: calc(100% + 4px); right: 0; z-index: 50; width: 224px; padding: 8px 0;
  border-radius: 6px; border: 1px solid var(--ren-divider); background: var(--ren-surface);
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
}
html[data-theme="dark"] .fin-dl-menu { border-color: #334155; }
.fin-dl-menu button {
  display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 16px; font: inherit; font-size: var(--ren-fs-sm);
  text-align: left; border: 0; background: none; color: var(--ren-text); cursor: pointer;
}
.fin-dl-menu button:hover, .fin-dl-menu button:focus-visible { background: var(--ren-gray-100); }
.ren-sheet-ico { color: #16a34a; }
.fin-dl-cancel { display: inline-flex; padding: 4px; border: 0; border-radius: 6px; background: none; color: var(--ren-text); cursor: pointer; }
.fin-dl-cancel:hover { background: var(--ren-gray-100); }
.fin-dl-btn:focus-visible, .fin-dl-cancel:focus-visible { outline: 2px solid var(--ren-primary); outline-offset: 2px; }
.fin-h3 { display: flex; align-items: center; gap: 8px; width: fit-content; font-size: var(--ren-fs-lg); font-weight: 600; cursor: pointer; user-select: none; }
.fin-h3:focus-visible { outline: 2px solid var(--ren-primary); outline-offset: 2px; }
.fin-chev { transition: transform 0.3s; }
.fin-chev-closed { transform: rotate(-90deg); }
.fin-desc { position: relative; width: 100%; padding: 20px; border-radius: 10px; background: var(--ren-desc-bg); }
.fin-desc-scroll { max-height: 320px; overflow-y: auto; padding-right: 8px; font-size: var(--ren-fs-base); font-weight: 400; color: var(--ren-grey-700); line-height: 1.5; }

/* Tabular (address, website, ...) */
.fin-tabular { width: 100%; display: flex; flex-direction: column; gap: 5px; }
.fin-tab-row { display: flex; gap: 20px; justify-content: space-between; }
.fin-tab-val { display: flex; justify-content: flex-end; text-align: right; }
.fin-a { color: var(--ren-primary); text-decoration: none; }

/* Historical employee count tile */
.fin-line-tile { display: flex; flex-direction: column; min-height: 240px; }

/* Historical Market Capitalization controls */
.fin-mc-controls { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; margin: 16px 0 8px; }
.fin-dates { display: flex; align-items: center; gap: 8px; }
.fin-date { display: flex; flex-direction: column; }
.fin-date label { font-size: var(--ren-fs-sm); margin-bottom: 4px; }
.fin-date input { font: inherit; width: 160px; padding: 0 8px; border: 1px solid var(--ren-divider); border-radius: 4px; background: transparent; color: inherit; }
html[data-theme="dark"] .fin-date input { color-scheme: dark; border-color: #334155; }
.fin-peers { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; padding-top: 16px; border-top: 1px solid var(--ren-divider); }
html[data-theme="dark"] .fin-peers { border-top-color: #334155; }
.fin-peers-h { font-size: var(--ren-fs-sm); font-weight: 500; white-space: nowrap; }
.fin-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.fin-chip { font: inherit; font-size: var(--ren-fs-xs); line-height: 16px; padding: 4px 12px; border-radius: 999px; border: 1px solid; cursor: pointer; }
.fin-chip:focus-visible { outline: 2px solid var(--ren-primary); outline-offset: 2px; }

/* Ratings snapshot */
.fin-rating { display: flex; align-items: center; }
.fin-rating-badge { flex: none; width: 96px; height: 96px; display: flex; align-items: center; justify-content: center; border-radius: 999px; }
.fin-rating-badge span { font-size: var(--ren-fs-4xl); line-height: 40px; font-weight: 700; color: #ffffff; }
.fin-rating-rows { margin-left: 32px; flex: 1; display: flex; flex-direction: column; gap: 8px; }
.fin-rating-row { display: flex; justify-content: space-between; }
.fin-rating-label { display: flex; align-items: center; gap: 4px; color: var(--ren-gray-700); }
.fin-info { display: inline-flex; cursor: pointer; }
.fin-rating-val { font-weight: 500; color: var(--ren-gray-900); }

/* Financial Scores */
.fin-scores { display: grid; gap: 32px; grid-template-columns: 1fr 1fr; }
@media (max-width: 767px) { .fin-scores { grid-template-columns: 1fr; } }
.fin-score { position: relative; }
.fin-score-z { min-height: 120px; }
.fin-score-top { display: flex; align-items: baseline; gap: 8px; }
.fin-score-val { font-size: var(--ren-fs-3xl); line-height: 36px; font-weight: 600; }
.fin-pill { display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 999px; font-size: var(--ren-fs-xs); line-height: 16px; font-weight: 500; }
.fin-xs { font-size: var(--ren-fs-xs); line-height: 16px; margin-top: 4px !important; }
.fin-grey { color: var(--ren-grey-600); }
.fin-zlegend { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 12px; font-size: var(--ren-fs-xs); line-height: 16px; color: var(--ren-grey-600); }
.fin-zlegend span { display: flex; align-items: center; gap: 4px; }
.fin-zlegend i { display: inline-block; width: 12px; height: 12px; border-radius: 999px; }
.fin-zbar-wrap { position: absolute; bottom: 20px; width: 100%; }
.fin-zbar { position: relative; display: flex; height: 12px; width: 100%; border-radius: 999px; background: var(--ren-neutral-200); }
.fin-zbar span { height: 100%; display: inline-block; }
.fin-zbar .fin-zl { border-radius: 999px 0 0 999px; }
.fin-zbar .fin-zr { border-radius: 0 999px 999px 0; }
.fin-zmark { position: absolute; top: -2px; transform: translateX(-50%); }
.fin-zmark div { width: 16px; height: 16px; border-radius: 999px; border: 2px solid var(--ren-white); box-shadow: var(--ren-shadow); background: var(--ren-black); }
.fin-pbar-wrap { width: 100%; margin-top: 12px; }
.fin-pbar { position: relative; height: 12px; width: 100%; border-radius: 999px; overflow: hidden; background: var(--ren-neutral-200); }
.fin-pbar div { height: 100%; }
.fin-pscale { display: flex; justify-content: space-between; font-size: var(--ren-fs-2xs); color: var(--ren-grey-600); margin-top: 4px; }
