/* KLC Fee Finder: scoped to .klcff-app so it doesn't clash with the theme.
   Colours and fonts follow klc.edu.sg (Avada theme): they read the theme's own
   variables first and fall back to the KLC values. */
.klcff-app{
  --klcff-accent:var(--primary_color,#22497F);
  --klcff-green:#00632B;
  --klcff-ink:var(--body_typography-color,#4A4E57);
  --klcff-head:var(--h2_typography-color,#22497F);
  --klcff-muted:#6B707A;
  --klcff-line:#DCDCDC;
  --klcff-field:var(--form_border_color,#E2E2E2);
  --klcff-bg:#F6F6F6;
  --klcff-tint:#F2F3F5;
  --klcff-panel:#FFFFFF;
  --klcff-btn-font:var(--button_typography-font-family,"Inter",Arial,Helvetica,sans-serif);
  color:var(--klcff-ink); font-family:inherit; font-size:16px; line-height:1.6;
  display:grid; gap:48px; max-width:1100px; margin:0 auto; container-type:inline-size;
}
.klcff-app *{box-sizing:border-box}
.klcff-app h2,.klcff-app h3{margin:0;line-height:1.25;text-wrap:balance;color:var(--klcff-head);font-weight:700}
.klcff-app p{margin:0}
.klcff-app .klcff-h1{font-size:30px}
.klcff-app .klcff-h2{font-size:22px}
.klcff-label{font-size:13px;font-weight:700;color:var(--klcff-green);letter-spacing:.02em}
.klcff-header{display:grid;gap:14px;max-width:760px}
.klcff-intro{font-size:17px}
.klcff-meta{display:flex;flex-wrap:wrap;gap:8px}
.klcff-pill{display:inline-flex;align-items:center;padding:4px 12px;border-radius:4px;font-size:14px;font-weight:700;background:var(--klcff-accent);color:#fff}
.klcff-pill.is-plain{background:var(--klcff-tint);color:var(--klcff-ink);font-weight:400}
.klcff-preview{background:#FFF4D6;border:1px solid #E8C66A;border-radius:4px;padding:10px 14px;font-size:14px}
.klcff-empty{padding:20px;border:1px solid var(--klcff-line);background:var(--klcff-panel)}

/* estimator */
.klcff-est{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start;background:var(--klcff-tint);padding:32px;border-radius:4px}
@container (max-width:760px){.klcff-est{grid-template-columns:1fr;padding:20px}.klcff-result{position:static}}
.klcff-form{display:grid;gap:22px;margin:0}
.klcff-fieldset{border:0;margin:0;padding:0;display:grid;gap:10px;min-width:0}
.klcff-fieldset legend{font-weight:700;font-size:15px;margin-bottom:8px;padding:0;color:var(--klcff-ink)}
.klcff-app select,.klcff-app input[type=number]{font:inherit;font-size:16px;color:#333;background:#fff;border:1px solid var(--klcff-field);border-radius:6px;padding:10px 12px;width:100%;height:auto;min-height:46px;max-width:100%;margin:0;box-shadow:none}
.klcff-field{display:grid;gap:6px;margin:0}
.klcff-field>span{font-size:15px;font-weight:700}
.klcff-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@container (max-width:420px){.klcff-row2{grid-template-columns:1fr}}
.klcff-seg{display:flex;flex-wrap:wrap;gap:8px}
.klcff-seg label{position:relative;cursor:pointer;margin:0}
.klcff-seg input{position:absolute;opacity:0;pointer-events:none}
.klcff-seg span{display:inline-block;font-family:var(--klcff-btn-font);font-weight:500;font-size:15px;letter-spacing:.015em;border:2px solid var(--klcff-accent);background:#fff;color:var(--klcff-accent);border-radius:4px;padding:9px 18px;transition:background .15s,color .15s}
.klcff-seg label:hover span{background:var(--klcff-tint)}
.klcff-seg input:checked+span{background:var(--klcff-accent);color:#fff}
.klcff-seg input:focus-visible+span{outline:2px solid var(--klcff-green);outline-offset:2px}
.klcff-check{display:flex;gap:10px;align-items:flex-start;font-size:15px;margin:0;cursor:pointer}
.klcff-check[hidden]{display:none}
.klcff-check input{margin-top:5px;accent-color:var(--klcff-accent);width:18px;height:18px;flex:none}
.klcff-check small{display:block;font-size:13px;color:var(--klcff-muted)}
.klcff-app select:focus-visible,.klcff-app input:focus-visible,.klcff-app a:focus-visible,.klcff-app summary:focus-visible,.klcff-table tr:focus-visible{outline:2px solid var(--klcff-accent);outline-offset:2px}

.klcff-result{background:var(--klcff-panel);border-top:4px solid var(--klcff-accent);border-radius:4px;padding:26px;display:grid;gap:18px;position:sticky;top:24px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.klcff-course-name{font-size:15px;color:var(--klcff-muted)}
.klcff-pay{display:grid;gap:6px}
.klcff-big{font-size:clamp(38px,6vw,52px);font-weight:700;line-height:1;color:var(--klcff-accent);font-variant-numeric:tabular-nums}
.klcff-big mark{background:none;color:inherit;padding:0}
.klcff-scheme{font-weight:700;color:var(--klcff-green)}
.klcff-bd{display:grid;border-top:1px solid var(--klcff-line)}
.klcff-bd div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--klcff-line);font-size:15px}
.klcff-bd div span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.klcff-bd .is-minus span:last-child{color:var(--klcff-green);font-weight:700}
.klcff-bd .is-total{font-weight:700;border-bottom:0;color:var(--klcff-accent);font-size:17px}
.klcff-alts{display:grid;gap:8px}
.klcff-alt{display:flex;justify-content:space-between;gap:12px;font-size:14px;padding:8px 12px;border-radius:4px;background:var(--klcff-tint)}
.klcff-alt span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.klcff-tips{margin:0;padding:0 0 0 18px;display:grid;gap:6px;font-size:14px;color:var(--klcff-muted)}
.klcff-warn{background:var(--klcff-tint);border-left:4px solid var(--klcff-green);padding:12px 14px;font-size:15px}
.klcff-links{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;font-size:14px}
.klcff-app a{color:var(--klcff-accent)}
.klcff-app a:hover{color:var(--klcff-green)}
.klcff-app a.klcff-btn{display:inline-block;font-family:var(--klcff-btn-font);font-weight:500;font-size:16px;letter-spacing:.015em;background:var(--klcff-accent);color:#fff;text-decoration:none;padding:13px 29px;border:2px solid var(--klcff-accent);border-radius:4px;transition:background .15s,color .15s}
.klcff-app a.klcff-btn:hover{background:#fff;color:var(--klcff-accent)}
.klcff-app a.klcff-btn.is-outline{background:#fff;color:var(--klcff-accent)}
.klcff-app a.klcff-btn.is-outline:hover{background:var(--klcff-accent);color:#fff}
.klcff-table-head{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between}
.klcff-table-head .klcff-btn{font-size:15px;padding:9px 20px}
.klcff-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.klcff-hint{font-size:14px;color:var(--klcff-muted)}

/* table: matches the bordered tables already on klc.edu.sg */
.klcff-table-wrap{display:grid;gap:12px}
.klcff-scroll{overflow-x:auto;background:var(--klcff-panel)}
.klcff-app table.klcff-table{border-collapse:collapse;width:100%;min-width:800px;font-size:15px;margin:0;border:1px solid var(--klcff-line);font-variant-numeric:tabular-nums;background:#fff}
.klcff-table th,.klcff-table td{padding:12px 16px;text-align:right;border:1px solid var(--klcff-line);vertical-align:top;background:transparent;line-height:1.5}
.klcff-table th:first-child,.klcff-table td:first-child,.klcff-table tbody th{text-align:left}
.klcff-table thead th{background:var(--klcff-bg);color:var(--klcff-ink);font-weight:700;padding:16px}
.klcff-table thead th small{display:block;font-weight:400;font-size:13px;color:var(--klcff-muted)}
.klcff-table tbody tr[data-course]{cursor:pointer}
.klcff-table tbody tr[data-course]:hover{background:var(--klcff-tint)}
.klcff-table tbody th{font-weight:400}
.klcff-cname{display:block;font-weight:700;color:var(--klcff-accent)}
.klcff-sub{display:block;font-size:13px;color:var(--klcff-muted)}
.klcff-na{color:#B9BCC2}
.klcff-full{color:var(--klcff-muted)}
.klcff-best{font-weight:700;color:var(--klcff-green)}
.klcff-pdf a{display:block;white-space:nowrap}
.klcff-table tbody th[scope=row]{min-width:260px}
.klcff-lvl th{background:var(--klcff-accent);color:#fff;font-size:14px;font-weight:700;padding:8px 16px;letter-spacing:.02em}

/* fee view switch: one funding group at a time */
.klcff-views{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.klcff-views-label{font-weight:700;font-size:15px;margin-right:4px}
.klcff-app button.klcff-view{font-family:var(--klcff-btn-font);font-weight:500;font-size:15px;letter-spacing:.015em;border:2px solid var(--klcff-accent);background:#fff;color:var(--klcff-accent);border-radius:4px;padding:8px 16px;cursor:pointer;line-height:1.3;margin:0;box-shadow:none;text-transform:none}
.klcff-app button.klcff-view:hover{background:var(--klcff-tint)}
.klcff-app button.klcff-view[aria-pressed="true"]{background:var(--klcff-accent);color:#fff}
.klcff-app button.klcff-view:focus-visible{outline:2px solid var(--klcff-green);outline-offset:2px}
.klcff-table-wrap .klcff-hint.klcff-g-company,.klcff-table-wrap .klcff-hint.klcff-g-ccp{display:none}
.klcff-table[data-view="self"] .klcff-g-company,.klcff-table[data-view="self"] .klcff-g-ccp,
.klcff-table[data-view="company"] .klcff-g-self,.klcff-table[data-view="company"] .klcff-g-ccp,
.klcff-table[data-view="ccp"] .klcff-g-self,.klcff-table[data-view="ccp"] .klcff-g-company{display:none}
.klcff-table-wrap[data-view="company"] .klcff-hint.klcff-g-self,.klcff-table-wrap[data-view="ccp"] .klcff-hint.klcff-g-self{display:none}
.klcff-table-wrap[data-view="company"] .klcff-hint.klcff-g-company,.klcff-table-wrap[data-view="ccp"] .klcff-hint.klcff-g-ccp{display:block}
.klcff-no{font-size:13px;color:var(--klcff-muted);white-space:nowrap}

/* small screens: each course becomes a card */
@container (max-width:640px){
  .klcff-app table.klcff-table{min-width:0;border:0}
  .klcff-table thead{display:none}
  .klcff-table tbody tr[data-course]{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px;padding:14px;border:1px solid var(--klcff-line);border-top:0}
  .klcff-table tbody tr[data-course]>*{padding:0;border:0;text-align:left;min-width:0}
  .klcff-table tbody th[scope=row]{grid-column:1/-1;min-width:0;margin-bottom:4px}
  .klcff-table tbody td[data-label]::before{content:attr(data-label);display:block;font-size:12px;font-weight:700;color:var(--klcff-muted)}
  .klcff-table tbody td.klcff-pdf{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:4px 14px}
  .klcff-table tbody td.klcff-na{display:none}
  .klcff-table tbody td.klcff-na:has(.klcff-no){display:block}
  .klcff-lvl,.klcff-lvl th{display:block}
}

/* faq */
.klcff-faq{display:grid;gap:0}
.klcff-faq .klcff-h2{margin-bottom:14px}
.klcff-faq details{border:1px solid var(--klcff-line);border-top-width:0;background:#fff}
.klcff-faq details:first-of-type{border-top-width:1px}
.klcff-faq summary{cursor:pointer;font-weight:700;color:var(--klcff-accent);padding:14px 18px;list-style-position:inside}
.klcff-faq details[open] summary{background:var(--klcff-bg)}
.klcff-faq details p{padding:12px 18px 16px;font-size:15px;max-width:75ch}
.klcff-foot{font-size:13px;color:var(--klcff-muted)}

@media (prefers-reduced-motion:reduce){.klcff-app *{scroll-behavior:auto!important;transition:none!important}}