/* Company finances: dense in-app view and private read-only TV presentation. */
.fin-page { --fin-blue: #0a67c7; --fin-teal: #087d6d; --fin-orange: #b45b08; max-width: 1280px; margin: 0 auto; padding-bottom: 44px; }
.fin-toolbar, .fin-toolbar-actions, .fin-live, .fin-panel-head, .fin-panel-title-actions, .fin-progress-wrap { display: flex; align-items: center; }
.fin-toolbar { justify-content: space-between; gap: 12px; margin: -8px 0 18px; }
.fin-toolbar-actions { gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.fin-live { gap: 8px; color: var(--mx-label-2); font-size: 13px; font-weight: 600; }
.fin-live-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--mx-gray); box-shadow: 0 0 0 4px color-mix(in srgb, var(--mx-gray) 14%, transparent); }
.fin-live-dot.is-complete { background: var(--mx-green); box-shadow: 0 0 0 4px color-mix(in srgb, var(--mx-green) 14%, transparent); }
.fin-live-dot.is-incomplete, .fin-live-dot.is-stale { background: var(--mx-orange); box-shadow: 0 0 0 4px color-mix(in srgb, var(--mx-orange) 14%, transparent); }
.fin-month { width: auto; min-width: 175px; height: 42px; border: .5px solid var(--mx-sep); border-radius: 13px; background: var(--mx-surface); color: var(--mx-label); padding: 0 34px 0 13px; font-weight: 650; }
.fin-notice { margin: 0 0 16px; padding: 14px 16px; border: .5px solid color-mix(in srgb, var(--mx-orange) 32%, transparent); border-radius: 16px; background: color-mix(in srgb, var(--mx-orange) 8%, var(--mx-surface)); }
.fin-notice strong { color: var(--mx-orange); }
.fin-notice p { margin: 4px 0 0; color: var(--mx-label-2); font-size: 14px; }
.fin-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.fin-metric { min-height: 145px; padding: 18px; border: .5px solid var(--mx-sep); border-radius: 22px; background: linear-gradient(150deg, color-mix(in srgb, var(--mx-surface) 96%, var(--mx-bg)), var(--mx-surface)); box-shadow: var(--mx-shadow-card); display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; }
.fin-metric::before { content: ''; display: block; width: 38px; height: 5px; margin-bottom: 24px; border-radius: 9px; background: var(--mx-gray); }
.fin-metric.is-blue::before { background: var(--fin-blue); }.fin-metric.is-teal::before { background: var(--fin-teal); }.fin-metric.is-orange::before { background: var(--fin-orange); }.fin-metric.is-green::before { background: var(--mx-green); }.fin-metric.is-red::before { background: var(--mx-red); }
.fin-metric-label { color: var(--mx-label-2); font-size: 13px; font-weight: 650; }
.fin-metric-value { margin-top: 8px; color: var(--mx-label); font-size: clamp(23px, 2.4vw, 34px); line-height: 1.05; letter-spacing: -.035em; overflow-wrap: anywhere; }
.fin-metric-hint { margin-top: 8px; color: var(--mx-label-3); font-size: 12px; }
.fin-formula { margin: -2px 0 14px; color: var(--mx-label-2); font-size: 13px; text-align: center; }
.fin-cover { display: grid; grid-template-columns: 1fr minmax(220px, .7fr); align-items: center; gap: 28px; margin: 0 0 16px; padding: 22px; border-radius: 22px; background: linear-gradient(125deg, color-mix(in srgb, var(--mx-accent) 14%, var(--mx-surface)), var(--mx-surface)); box-shadow: var(--mx-shadow-card); }
.fin-cover-copy { display: grid; gap: 4px; }.fin-cover-copy > span { color: var(--mx-label-2); font-size: 13px; font-weight: 650; }.fin-cover-copy strong { font-size: clamp(27px, 4vw, 46px); letter-spacing: -.04em; }.fin-cover-copy small { color: var(--mx-label-2); }
.fin-progress-wrap { gap: 12px; }.fin-progress-wrap span { min-width: 56px; text-align: right; font-weight: 750; }
.fin-progress { width: 100%; height: 12px; border: 0; border-radius: 99px; overflow: hidden; background: var(--mx-fill); accent-color: var(--mx-accent); }.fin-progress::-webkit-progress-bar { background: var(--mx-fill); border-radius: 99px; }.fin-progress::-webkit-progress-value { background: linear-gradient(90deg, var(--mx-accent), #35ad82); border-radius: 99px; }
.fin-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.fin-panel { margin: 0 0 14px; border-radius: 22px; background: var(--mx-surface); box-shadow: var(--mx-shadow-card); overflow: hidden; }
.fin-panel-head { justify-content: space-between; gap: 12px; padding: 15px 17px 10px; }.fin-panel-head > h2, .fin-panel-title-actions h2 { margin: 0; color: var(--mx-label); font-size: 17px; }.fin-panel-head > small { color: var(--mx-label-2); text-align: right; }
.fin-panel-title-actions { gap: 10px; }.fin-text-button, .fin-row-action { border: 0; background: transparent; color: var(--mx-accent); font: inherit; font-weight: 650; cursor: pointer; }.fin-row-action { padding: 8px 14px; }
.fin-row { position: relative; min-height: 61px; padding: 11px 16px; display: flex; align-items: center; gap: 12px; }.fin-row + .fin-row::before { content: ''; position: absolute; top: 0; left: 16px; right: 0; height: .5px; background: var(--mx-sep); }
.fin-row-copy { min-width: 0; flex: 1; display: grid; gap: 3px; }.fin-row-copy strong { font-size: 15px; }.fin-row-copy small { color: var(--mx-label-2); font-size: 12px; overflow-wrap: anywhere; }.fin-row-value { flex: none; color: var(--mx-label); font-weight: 720; text-align: right; }
.fin-footnote, .fin-form-note { color: var(--mx-label-2); font-size: 12px; line-height: 1.45; }.fin-form-note { margin: 0; }.fin-check { display: flex; align-items: center; gap: 10px; color: var(--mx-label); font-size: 14px; }.fin-check input { width: 20px; height: 20px; }
.fin-loading, .fin-error { max-width: 560px; margin: 20vh auto; padding: 24px; border-radius: 22px; background: var(--mx-surface); box-shadow: var(--mx-shadow-card); text-align: center; color: var(--mx-label-2); }.fin-error h1 { color: var(--mx-label); font-size: 24px; }
body.mx-finance-tv { background: #edf1f5; }.mx-finance-tv .mx-sidebar, .mx-finance-tv .mx-toolbar, .mx-finance-tv .mx-mobile-header, .mx-finance-tv .mx-tabbar, .mx-finance-tv .mx-fab { display: none !important; }.mx-finance-tv .mx-content { margin: 0; max-width: none; padding: clamp(28px, 4vw, 70px); }.mx-finance-tv .fin-page { max-width: 1760px; padding: 0; }.mx-finance-tv .mx-page-head { margin-bottom: 26px; }.mx-finance-tv .mx-large-title { font-size: clamp(42px, 5vw, 78px); line-height: 1; }.mx-finance-tv .mx-subtitle, .mx-finance-tv .fin-live { font-size: clamp(17px, 1.4vw, 26px); }.mx-finance-tv .fin-metric { min-height: clamp(180px, 22vh, 310px); padding: clamp(22px, 2.5vw, 42px); }.mx-finance-tv .fin-metric-label, .mx-finance-tv .fin-metric-hint { font-size: clamp(15px, 1.25vw, 23px); }.mx-finance-tv .fin-metric-value { font-size: clamp(34px, 4.2vw, 76px); }.mx-finance-tv .fin-cover { min-height: 17vh; padding: clamp(24px, 3vw, 50px); }.mx-finance-tv .fin-cover-copy > span, .mx-finance-tv .fin-cover-copy small, .mx-finance-tv .fin-progress-wrap { font-size: clamp(16px, 1.3vw, 25px); }.mx-finance-tv .fin-cover-copy strong { font-size: clamp(40px, 5vw, 88px); }.mx-finance-tv .fin-panel-head h2 { font-size: clamp(21px, 2vw, 34px); }.mx-finance-tv .fin-row { min-height: 76px; }.mx-finance-tv .fin-row-copy strong, .mx-finance-tv .fin-row-value { font-size: clamp(18px, 1.6vw, 29px); }.mx-finance-tv .fin-row-copy small { font-size: clamp(13px, 1vw, 19px); }
@media (max-width: 940px) { .fin-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }.fin-columns { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .fin-toolbar { align-items: flex-start; flex-direction: column; }.fin-toolbar-actions { width: 100%; justify-content: stretch; }.fin-month { flex: 1; min-width: 0; }.fin-toolbar-actions .mx-btn { flex: 1; }.fin-metrics { grid-template-columns: 1fr; }.fin-metric { min-height: 124px; }.fin-cover { grid-template-columns: 1fr; gap: 18px; }.fin-panel-head { align-items: flex-start; flex-direction: column; }.fin-panel-head > small { text-align: left; }.fin-row { flex-wrap: wrap; }.fin-row-value { margin-left: auto; } }
@media (prefers-reduced-motion: reduce) { .fin-live-dot { box-shadow: none; } }
@media (prefers-color-scheme: dark) { body.mx-finance-tv { background: #101114; } }
/* TV link dialog (owner) and the standalone TV page (/tv.html, read-only link). */
.fin-tv-link { display: grid; gap: 10px; }
.fin-tv-url { width: 100%; height: 42px; border: .5px solid var(--mx-sep); border-radius: 12px; padding: 0 12px; background: var(--mx-surface); color: var(--mx-label); font: inherit; font-size: 13px; }
body.fin-tv-standalone { min-height: 100vh; }
.fin-tv-standalone .mx-content { display: block; min-height: 100vh; box-sizing: border-box; }
.fin-tv-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.fin-tv-titles .mx-subtitle { margin: 8px 0 0; color: var(--mx-label-2); }
.fin-tv-side { display: grid; justify-items: end; gap: 8px; }
.fin-tv-clock { color: var(--mx-label); font-size: clamp(18px, 1.6vw, 30px); font-weight: 700; }
.fin-tv-standalone .fin-notice { margin-bottom: 18px; }
.fin-tv-standalone .fin-notice p, .fin-tv-standalone .fin-notice strong { font-size: clamp(15px, 1.2vw, 22px); }
@media (max-width: 620px) { .fin-tv-side { justify-items: start; } }
/* TV numbers stay on one line (no break inside an amount); the month picker gets its own row on phones. */
.mx-finance-tv .fin-metric-value { font-size: clamp(26px, 2.2vw, 44px); overflow-wrap: normal; }
@media (max-width: 620px) { .fin-toolbar-actions .fin-month { flex: 1 1 100%; } }
/* F17: the one main number "Príjem po províziách" (income after commissions) is the first, tinted metric. */
.fin-metric.fin-metric-main { border-color: color-mix(in srgb, var(--fin-teal) 45%, var(--mx-sep)); background: linear-gradient(150deg, color-mix(in srgb, var(--fin-teal) 10%, var(--mx-surface)), var(--mx-surface)); }
.fin-progress-wrap span { white-space: nowrap; }