/* UGrowth free tools: /msme-payment-calculator and /gem-documents.
   Loaded after main.css. Only what main.css does not already have: the form + result
   layout, the result rows, and the letter "paper" with its print rules. */

/* ---------- layout: form on the left, result / preview on the right (desktop) ---------- */
.tool-layout{display:grid;gap:16px;grid-template-columns:minmax(0,1fr);align-items:start}
.tool-layout>*{min-width:0}
@media (min-width:900px){
  .tool-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:24px}
  .tool-sticky{position:sticky;top:calc(var(--head-h) + 14px)}
}
.tool-form{gap:14px}
.tool-h{font-size:24px;margin:0}
.tool-step{display:flex;align-items:center;gap:10px}
.tool-step .n{font-family:var(--f-display);font-size:34px;line-height:1;color:var(--brass);font-weight:600}
.tool-sub{color:var(--muted);font-size:14.5px;margin:0}
.tool-msg{color:var(--bad);font-size:13.5px;font-weight:600;margin:0}
.tool-msg:empty{display:none}
.field textarea.short{min-height:72px}
.field.is-hidden,.tool-hide{display:none}
.field .req{color:var(--bad);font-weight:700}
.tool-check{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.45}
.tool-check input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:var(--navy-ink)}
.tool-checks{display:grid;gap:10px}
.tool-fieldset{border:0;margin:0;padding:0;display:grid;gap:10px;min-width:0}
.tool-fieldset legend{font-weight:700;font-size:13px;padding:0;margin-bottom:2px}

/* ---------- result panel ---------- */
.tool-result{gap:12px}
.tool-empty{color:var(--muted);font-size:14.5px;margin:0}
.tool-bigs{display:grid;gap:10px;grid-template-columns:1fr 1fr}
.tool-big{background:var(--sunk);border-radius:var(--r-sm);padding:12px 14px;display:grid;gap:2px;align-content:start;min-width:0}
.tool-big span{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.tool-big b{font-family:var(--f-mono);font-variant-numeric:tabular-nums;font-size:clamp(18px,5.4vw,26px);line-height:1.15;overflow-wrap:anywhere}
.tool-big.hot{background:var(--brass-soft)}
.tool-big.hot b{color:var(--brass-ink)}
.tool-rows{display:grid;margin:0;font-size:14.5px}
.tool-rows div{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--line)}
.tool-rows div:last-child{border-bottom:0}
.tool-rows dt{color:var(--muted)}
.tool-rows dd{margin:0;font-weight:700;text-align:right;font-family:var(--f-mono);font-variant-numeric:tabular-nums;font-size:13.5px}
.tool-explain{font-size:14.5px;line-height:1.65;margin:0}
.tool-actions{display:flex;flex-wrap:wrap;gap:10px}
.tool-actions .btn{flex:1 1 200px}
.tool-law{display:grid;gap:10px}
.tool-law li{margin-left:18px}
.tool-cite{font-size:12.5px;color:var(--muted)}
.tool-cite a{color:var(--link);text-decoration:underline}
.tool-status{min-height:1.2em;font-size:13px;color:var(--good);font-weight:600;margin:0}
.tool-status:empty{display:none}

/* ---------- template picker (GeM page) ---------- */
.tool-tabs{display:grid;gap:8px;grid-template-columns:1fr 1fr}
@media (min-width:700px){.tool-tabs{grid-template-columns:repeat(4,1fr)}}
.tool-tabs button{border:1px solid var(--line2);background:var(--surface);border-radius:12px;padding:10px 12px;min-height:56px;font-weight:700;font-size:13.5px;line-height:1.25;color:var(--ink);text-align:left;display:grid;gap:2px;align-content:center}
.tool-tabs button small{font-weight:500;color:var(--muted);font-size:12px}
.tool-tabs button[aria-pressed="true"]{border-color:var(--navy-ink);background:var(--navy-ink);color:#f4f6fa;box-shadow:0 6px 16px -8px rgba(11,31,58,.6)}
.tool-tabs button[aria-pressed="true"] small{color:#c9d3e6}
:root[data-theme="dark"] .tool-tabs button[aria-pressed="true"]{background:#e8ecf4;color:#0b1f3a;border-color:#e8ecf4}
:root[data-theme="dark"] .tool-tabs button[aria-pressed="true"] small{color:#33415c}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .tool-tabs button[aria-pressed="true"]{background:#e8ecf4;color:#0b1f3a;border-color:#e8ecf4}
  :root:not([data-theme="light"]) .tool-tabs button[aria-pressed="true"] small{color:#33415c}
}
.tool-pane[hidden]{display:none}
.tool-doc-list{display:grid;gap:14px}
.tool-doc-list h3{font-size:19px}
.tool-doc-list p{color:var(--muted);font-size:14.5px;margin:0}

/* ---------- the letter (stays white with dark text in dark mode, as paper does) ---------- */
.paper-wrap{background:var(--sunk);border-radius:var(--r);padding:12px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.letter{background:#fff;color:#111;font-family:Georgia,"Times New Roman",Times,serif;font-size:14px;line-height:1.55;padding:22px 20px 26px;border-radius:6px;box-shadow:0 1px 2px rgba(15,26,46,.12),0 10px 28px -16px rgba(15,26,46,.4);max-width:760px;margin:0 auto;overflow-wrap:anywhere}
@media (min-width:561px){.letter{padding:36px 40px 40px;font-size:14.5px}}
.letter p,.letter ol{margin:0 0 12px;color:#111}
.letter ol{padding-left:22px}
.letter li{margin:0 0 6px;color:#111}
.letter .lt-head{border-bottom:2px solid #111;padding-bottom:10px;margin-bottom:16px}
.letter .lt-head .lt-name{font-size:19px;font-weight:700;letter-spacing:.01em;margin:0 0 2px}
.letter .lt-head p{margin:0;font-size:13px}
.letter .lt-space{border:1px dashed #9aa3b2;color:#6b7385;font-family:var(--f-body);font-size:12px;text-align:center;padding:26px 8px;margin-bottom:16px;border-radius:4px}
.letter .lt-right{text-align:right}
.letter .lt-title{text-align:center;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin:6px 0 14px;text-decoration:underline}
.letter .lt-subject{font-weight:700}
.letter .lt-small{font-size:12.5px;color:#333}
.letter .lt-sign{margin-top:26px}
.letter .lt-sign p{margin:0}
.letter .lt-sign .lt-gap{height:34px}
.letter mark.ph{background:#fff2c2;color:#5c3d00;padding:0 2px;border-radius:3px}
.paper-note{font-size:12.5px;color:var(--muted);margin:0}

/* ---------- print: only the letter, on a plain white A4 page ---------- */
@media print{
  @page{size:A4;margin:16mm 16mm 18mm}
  html,body{background:#fff!important;color:#000!important;margin:0!important;padding:0!important;height:auto!important}
  [data-ph]{display:none!important}
  [data-pk]{display:block!important;position:static!important;transform:none!important;box-shadow:none!important;border:0!important;background:none!important;padding:0!important;margin:0!important;width:auto!important;max-width:none!important;min-width:0!important;overflow:visible!important;opacity:1!important}
  .letter{box-shadow:none!important;border-radius:0!important;max-width:none!important;padding:0!important;margin:0!important;font-size:11.5pt!important;line-height:1.5!important}
  .letter .lt-space{border:0!important;color:transparent!important;padding:32mm 0 0!important;margin:0!important}
  .letter mark.ph{background:none!important;color:#000!important;padding:0!important}
  .letter p,.letter li{orphans:3;widows:3}
  .letter .lt-sign{break-inside:avoid}
}