/* Financial Intelligent System — the report's own stylesheet.
   Every rule here is scoped to .fis-scope (the class on each of its view fragments' root). The one
   exception is the help box, which the KPI strip's help panel (#kpiHelp) shares. Colours, sizes and
   radii follow the prototype (Reference/daily-tb-risk-dashboard_25.html, CSS L10–262): the --p-*
   tokens are defined once in css/fis-theme.css (prototype light on light/forest/slate, prototype
   dark on midnight/ocean/aurora). */
.fis-scope{font-family:var(--p-font);color:var(--p-ink);line-height:1.55;}

/* ── overview layout ── */
.fis-scope .fis-ov{display:flex;flex-direction:column;gap:14px;min-width:0;}
/* the prototype's grid (L27–30): .grid .g4 / .g3 / .g2 / .span2, gap 14px, 2 / 1 columns at 1000px, g4 1 column at 520px */
.fis-scope .fg{display:grid;gap:14px;min-width:0;}
.fis-scope .fg > *{min-width:0;}
.fis-scope .fg4{grid-template-columns:repeat(4,minmax(0,1fr));}
.fis-scope .fg3{grid-template-columns:repeat(3,minmax(0,1fr));}
.fis-scope .fg2{grid-template-columns:repeat(2,minmax(0,1fr));}
.fis-scope .fspan2{grid-column:span 2;}
.fis-scope .fg-top{align-items:start;}
.fis-scope .fg-top > .fis-card{height:auto;}
@media (max-width:1000px){
  .fis-scope .fg4{grid-template-columns:repeat(2,minmax(0,1fr));}
  .fis-scope .fg3,.fis-scope .fg2{grid-template-columns:minmax(0,1fr);}
  .fis-scope .fspan2{grid-column:auto;}
}
@media (max-width:520px){ .fis-scope .fg4{grid-template-columns:minmax(0,1fr);} }
.fis-scope .fis-head{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;}
.fis-scope .fis-head-t{font-size:calc(18px*var(--fz,1));font-weight:700;color:var(--p-ink);margin-right:auto;min-width:0;}
.fis-scope .fis-head-t span{font-size:calc(13px*var(--fz,1));font-weight:500;color:var(--p-muted);margin-left:4px;}
/* prototype .btn / .btn.primary */
.fis-scope .fis-btn{font:inherit;font-size:calc(12.5px*var(--fz,1));font-weight:500;padding:6px 11px;border-radius:8px;cursor:pointer;
  border:1px solid var(--p-line);background:var(--p-soft);color:var(--p-ink);}
.fis-scope .fis-btn:hover{border-color:var(--p-accent);}
.fis-scope .fis-btn.on{background:var(--p-accent);border-color:var(--p-accent);color:var(--p-on-accent);}
/* prototype .section-title */
.fis-scope .fis-sec{display:flex;align-items:center;gap:0;font-size:calc(16px*var(--fz,1));font-weight:700;color:var(--p-ink);margin:8px 0 10px;}
.fis-scope .fis-sec .fis-hbtn{margin-left:0;}

/* ── insight cards (prototype .insight) ── */
.fis-scope .fis-ins-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:14px;}
.fis-scope .fis-ins{background:var(--p-card);border:1px solid var(--p-line);border-left:4px solid var(--p-accent);
  border-radius:10px;padding:12px 14px;color:var(--p-ink);min-width:0;display:flex;flex-direction:column;}
.fis-scope .fis-ins.good{border-left-color:var(--p-good);}
.fis-scope .fis-ins.warn{border-left-color:var(--p-warn);}
.fis-scope .fis-ins.bad{border-left-color:var(--p-bad);}
.fis-scope .fis-tag{align-self:flex-start;font-size:calc(11px*var(--fz,1));font-weight:700;letter-spacing:.4px;color:var(--p-muted);}
.fis-scope .fis-ins b{display:block;margin:3px 0 4px;font-size:calc(14.5px*var(--fz,1));font-weight:700;line-height:1.45;font-variant-numeric:tabular-nums;}
.fis-scope .fis-ins p{font-size:calc(13px*var(--fz,1));line-height:1.55;color:var(--p-muted);margin:0;flex:1;}
.fis-scope .fis-rule{font-size:calc(11px*var(--fz,1));line-height:1.4;color:var(--p-muted);margin-top:8px;padding-top:6px;border-top:1px dashed var(--p-line);}

/* ── cards (prototype .card) ── */
.fis-scope .fis-card{background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;padding:16px;
  color:var(--p-ink);min-width:0;height:100%;}
.fis-scope .fis-card h3{display:flex;align-items:center;flex-wrap:wrap;gap:0;margin:0 0 2px;font-size:calc(15px*var(--fz,1));font-weight:600;line-height:1.4;}
.fis-scope .fis-desc{font-size:calc(12.5px*var(--fz,1));color:var(--p-muted);margin:0 0 10px;line-height:1.5;}
/* prototype .hbtn */
.fis-scope .fis-hbtn{flex:none;display:inline-grid;place-items:center;width:18px;height:18px;margin:0 0 0 6px;padding:0;
  border-radius:50%;cursor:pointer;border:1px solid var(--p-line);background:var(--p-soft);color:var(--p-muted);
  font:inherit;font-size:calc(11px*var(--fz,1));font-weight:600;line-height:1;}
.fis-scope .fis-hbtn:hover,.fis-scope .fis-hbtn.on{background:var(--p-accent);border-color:var(--p-accent);color:var(--p-on-accent);}
.fis-scope .fis-hbtn:focus-visible,.fis-scope .fis-btn:focus-visible{outline:2px solid var(--p-accent);outline-offset:1px;}

/* ── help box: ดูอะไร / อ่านอย่างไร / ใช้ตัดสินใจ (prototype .hlp) ── */
.fis-scope .fis-hlp,.kpi-help .fis-hlp{display:grid;gap:4px;font-size:calc(12.5px*var(--fz,1));line-height:1.6;font-weight:400;
  margin:6px 0 10px;padding:10px 12px;border-radius:10px;color:var(--p-ink);
  background:color-mix(in srgb,var(--p-accent) 7%,var(--p-card));border:1px solid color-mix(in srgb,var(--p-accent) 22%,transparent);}
.fis-scope .fis-hlp b,.kpi-help .fis-hlp b{display:inline-block;min-width:84px;margin-right:6px;color:var(--p-accent);font-weight:600;font-size:calc(12px*var(--fz,1));}
.fis-scope .fis-hlp[hidden]{display:none;}

/* ── tables (prototype table / th / td) ── */
.fis-scope .fis-tbl{width:100%;border-collapse:collapse;font-size:calc(13px*var(--fz,1));color:var(--p-ink);}
.fis-scope .fis-tbl th{text-align:left;font-weight:500;color:var(--p-muted);padding:8px 6px;border-bottom:1px solid var(--p-line);white-space:nowrap;}
.fis-scope .fis-tbl td{padding:7px 6px;border-bottom:1px solid var(--p-line);vertical-align:top;line-height:1.45;}
.fis-scope .fis-tbl tr:last-child td{border-bottom:0;}
.fis-scope .fis-tbl td:first-child{width:28px;color:var(--p-muted);}
/* prototype .pill / .p-bad / .p-warn / .p-good */
.fis-scope .fis-pill{display:inline-block;padding:2px 8px;border-radius:99px;font-size:calc(11.5px*var(--fz,1));font-weight:600;white-space:nowrap;}
.fis-scope .fis-pill.bad{background:var(--p-bad-bg);color:var(--p-bad);}
.fis-scope .fis-pill.warn{background:var(--p-warn-bg);color:var(--p-warn);}
.fis-scope .fis-pill.good{background:var(--p-good-bg);color:var(--p-good);}
.fis-scope .empty-note,.fis-scope .empty-cell{color:var(--p-muted);font-size:calc(13px*var(--fz,1));}
.fis-scope .fis-empty-t{font-size:calc(15px*var(--fz,1));font-weight:700;color:var(--p-ink);margin-bottom:4px;}

/* a period is being fetched */
body.fis-busy .fis-scope,body.fis-busy .kpi-strip{opacity:.55;transition:opacity .15s;}
body.fis-busy{cursor:progress;}

@media (max-width:767.98px){
  .fis-scope .fis-head-t{font-size:calc(16px*var(--fz,1));}
  .fis-scope .fis-card{padding:12px;}
  .fis-scope .fis-hlp b,.kpi-help .fis-hlp b{display:block;min-width:0;}
}