/* 잉여현금흐름(FCF) 카드 (fcf-card.js). 실적 발표 카드와 같은 카드 틀·머리글을 쓴다. */
#earnings-card[hidden]{display:none!important}
#fcf-card{min-width:0}
#fcf-card .fcf-top{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin:4px 0 8px}
#fcf-card .fcf-big{font-size:30px;line-height:1.2;font-weight:800;color:#19804d;letter-spacing:-.5px}
#fcf-card .fcf-big.neg{color:#cf5a52}
#fcf-card .fcf-top small{font-size:13px;color:#65726b}
#fcf-card .fcf-top b.pos{color:#19804d}#fcf-card .fcf-top b.neg{color:#cf5a52}
#fcf-card .fcf-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:#65726b;margin:0 0 4px;line-height:18px}
#fcf-card .fcf-legend i{display:inline-block;width:9px;height:9px;margin-right:5px;border-radius:2px}
#fcf-card .fcf-legend i.line{height:3px;vertical-align:middle;border-radius:2px;width:14px}
#fcf-card .fcf-svg{width:100%;height:auto;display:block;margin:0}
#fcf-card .fcf-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
#fcf-card .fcf-stats div{background:#f5f7ef;border:1px solid #e4e8e5;border-radius:10px;padding:12px 8px;text-align:center}
#fcf-card .fcf-stats small{display:block;font-size:12px;color:#85887e;white-space:nowrap}
#fcf-card .fcf-stats strong{display:block;font-size:20px;margin-top:4px;color:#225d3d;white-space:nowrap}
html[data-theme=dark] #fcf-card .fcf-stats div{background:#14161a;border-color:#2e323b}
html[data-theme=dark] #fcf-card .fcf-stats small,html[data-theme=dark] #fcf-card .fcf-top small,html[data-theme=dark] #fcf-card .fcf-legend{color:#a1a6af}
html[data-theme=dark] #fcf-card .fcf-stats strong{color:#57c288}
html[data-theme=dark] #fcf-card .fcf-svg .fcf-val{fill:#e3e5ea}
html[data-theme=dark] #fcf-card .earn-head{border-bottom:1px solid #2e323b}
@media(max-width:600px){#fcf-card .fcf-stats strong{font-size:16px}#fcf-card .fcf-big{font-size:26px}}
/* 머리글 줄: 자사주 매입·주당 배당금 카드와 같은 모양(제목과 알약 토글이 같은 수평선, 선은 그 아래). 옆 유동자산·유동부채 카드 제목 줄도 같은 높이로 맞춰 선이 이어진다. */
#fcf-card .fcf-heading,#liquidity .fcf-heading{display:flex;justify-content:space-between;align-items:center;box-sizing:border-box;height:57px;margin:0 0 16px;padding:0 0 14px;border-bottom:1px solid #dfe5df}
#fcf-card .fcf-heading h2,#liquidity .fcf-heading h2{margin:0;padding:0;border:0;height:auto;font-size:20px;line-height:27px}
html[data-theme=dark] #fcf-card .fcf-heading{border-bottom-color:#2e323b}

/* 유동자산·유동부채 표와 같은 모양(위 규칙의 #liquidity 를 #fcf-card 로 복제) */
#fcf-card .liq-scroll{overflow-x:auto}
#fcf-card .liq-content{width:100%}
#fcf-card svg{width:100%;height:auto;display:block;margin:0!important;min-height:0!important}
body.analysis-compact #fcf-card table{border-collapse:collapse;table-layout:fixed;width:100%;margin:0;font-size:15px;font-variant-numeric:tabular-nums}
body.analysis-compact #fcf-card :is(th,td){border:0;border-bottom:1px solid #e4e8e5;background:transparent!important;padding:8px 0!important;height:48px;box-sizing:border-box;text-align:center;font-weight:400;white-space:nowrap}
body.analysis-compact #fcf-card th{text-align:left;font-size:13px;color:#65726b;padding-left:4px!important;line-height:1.2}
@media(max-width:760px){#fcf-card .liq-content{width:100%;min-width:0}#fcf-card .liq-scroll{overflow-x:hidden}}
@media(max-width:760px){body.analysis-compact #fcf-card table{font-size:12px}}
@media(min-width:761px){body.analysis-compact .financial-chart-area,body.analysis-compact #fcf-card .liq-content{container-type:inline-size}}
@media(min-width:761px){@container (max-width:470px){body.analysis-compact #fcf-card table td{font-size:13px!important}}} /* 유동성 표와 같은 기준: 평소 15px, 카드가 좁을 때만 13px */
html[data-theme=dark] body.analysis-compact #fcf-card :is(th,td){border:0;border-bottom:1px solid #2d313a;background:transparent!important}
html[data-theme=dark] body.analysis-compact #fcf-card th{color:#b6bac3}
html[lang="en"] body #fcf-card .liq-content table{table-layout:fixed}
html[lang="en"] body #fcf-card .liq-content th{width:96px!important;white-space:normal!important;padding-right:12px!important;line-height:1.3;word-break:normal;overflow-wrap:normal}
/* 막대 위 금액은 금색 선·점과 겹쳐도 읽히도록 카드 배경색 테두리를 두른다 */
#fcf-card .fcf-svg .fcf-val{paint-order:stroke;stroke:#fff;stroke-width:3px;stroke-linejoin:round}
html[data-theme=dark] #fcf-card .fcf-svg .fcf-val{stroke:none;stroke-width:0}
