/* OB MEDEVAC Per Diem Estimator · brand pass (Spruce & Gold, after the Salary Calculator).
   CSS only: this page uses Tailwind utility classes (CDN), so rules are scoped with `body` to outrank them.
   Loaded after the tool's own <style> and /tools/_shared/mfp-tools.css. Delete the <link> to revert. */
body[class] { background-color: var(--mfp-paper) !important; color: var(--mfp-text); padding: clamp(1rem, 3.5vw, 3.5rem); }
body > .max-w-7xl { max-width: 1200px; background: transparent !important; box-shadow: none !important; padding: 0 !important; border-radius: 0; }

/* title block */
body header, body header.text-center { text-align: left; margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--mfp-line); }
body header h1 { font-family: var(--mfp-display); font-size: clamp(1.9rem, 4.2vw, 3rem); font-weight: 600; letter-spacing: -0.035em; line-height: 1.05; color: var(--mfp-text) !important; max-width: 20ch; }
body header p { font-size: 1.05rem; line-height: 1.6; color: var(--mfp-muted) !important; max-width: 58ch; margin-top: 0.9rem; }

/* sections become cards */
body form > section { background: var(--mfp-card); border: 1px solid var(--mfp-line); border-radius: var(--mfp-r-lg); box-shadow: var(--mfp-shadow); padding: clamp(1.25rem, 3vw, 2rem); }
body section h2 { font-family: var(--mfp-display); font-size: 1.35rem; font-weight: 600; letter-spacing: -0.02em; color: var(--mfp-text) !important; margin-bottom: 1.5rem; }
body #resultsSection h2 { font-size: clamp(1.5rem, 3vw, 2rem); }
body h3 { font-family: var(--mfp-display); letter-spacing: -0.02em; color: var(--mfp-text) !important; }

/* inputs: sentence-case labels (these are long), 3rem controls, gold focus ring */
body .input-group label { font: 600 0.88rem var(--mfp-body); color: var(--mfp-text); margin-bottom: 0.5rem; }
body .input-group input[type="date"], body .input-group input[type="number"], body .input-group input[type="text"], body .input-group select, body input.w-full {
  min-height: 3rem; padding: 0.7rem 0.95rem; border: 1px solid var(--mfp-line); border-radius: var(--mfp-r-sm); background: #fff; color: var(--mfp-text);
  font-family: var(--mfp-body); font-size: 1rem; transition: border-color .25s var(--mfp-ease), box-shadow .25s var(--mfp-ease);
}
body .input-group input[type="number"] { font-family: var(--mfp-mono); font-size: 0.95rem; }
body .input-group input:hover { border-color: var(--mfp-line-strong); }
body .input-group input:focus { outline: none; border-color: var(--mfp-signal); box-shadow: 0 0 0 4px rgba(var(--mfp-signal-rgb), 0.28); }
body .input-group .description { font-size: 0.85rem; line-height: 1.5; color: var(--mfp-muted); margin-top: 0.4rem; }
body .custom-checkbox { border: 1.5px solid var(--mfp-line-strong); border-radius: 6px; width: 1.4rem; height: 1.4rem; margin-right: 0.6rem; background: #fff; flex: none; }
body .custom-checkbox:checked { background: var(--mfp-ink); border-color: var(--mfp-ink); }
body .custom-checkbox:checked::after { color: var(--mfp-signal); font-size: 0.85rem; }
body .input-group .flex label { font-weight: 500; color: var(--mfp-text); }
body #errorMessages div { border-radius: var(--mfp-r-md); }

/* buttons */
body button[type="submit"], body #exportCsvButton {
  border-radius: 9999px; font-family: var(--mfp-body); font-weight: 600; min-height: 3.25rem; box-shadow: none;
  transition: transform .35s var(--mfp-ease), box-shadow .35s var(--mfp-ease), background-color .25s;
}
body button[type="submit"] { background: var(--mfp-ink); color: var(--mfp-on-ink); font-size: 1.05rem; }
body #exportCsvButton { background: transparent; color: var(--mfp-ink); border: 1px solid var(--mfp-line-strong); min-height: 2.75rem; font-size: 0.9rem; }
body button[type="submit"]:hover { background: var(--mfp-ink); transform: translateY(-2px); box-shadow: 0 10px 22px -8px rgba(var(--mfp-ink-rgb), 0.5); }
body #exportCsvButton:hover { background: var(--mfp-surface-2); }
body button:active { transform: none; box-shadow: none; }

/* results: the summary is the page's one flat ink block, figures in gold */
body #resultsSection > .bg-slate-50 { background: var(--mfp-ink) !important; color: var(--mfp-on-ink); border-radius: var(--mfp-r-lg); box-shadow: none; padding: clamp(1.25rem, 3vw, 2rem); position: relative; overflow: hidden; }
body #resultsSection > .bg-slate-50::after { content: ""; position: absolute; left: 0; bottom: 0; height: 3px; width: 44%; background: var(--mfp-signal); border-radius: 0 3px 0 0; }
body #resultsSection > .bg-slate-50 h3 { color: var(--mfp-on-ink-dim) !important; font: 600 0.72rem var(--mfp-body); letter-spacing: 0.09em; text-transform: uppercase; }
body #resultsSection > .bg-slate-50 p { font-size: 1rem; color: var(--mfp-on-ink-dim); }
body #resultsSection .text-green-600, body #resultsSection .text-green-700 { color: var(--mfp-signal) !important; font-family: var(--mfp-mono); font-weight: 500; font-variant-numeric: tabular-nums; }
body #grandTotalPerDiem { font-family: var(--mfp-display); font-size: 2.2rem; font-weight: 600; letter-spacing: -0.04em; }
body #resultsSection > .bg-slate-50 p.font-bold { color: var(--mfp-on-ink); }

/* breakdown table */
body #resultsSection .overflow-x-auto { border-radius: var(--mfp-r-lg); box-shadow: var(--mfp-shadow); border: 1px solid var(--mfp-line); }
body #resultsSection table { background: var(--mfp-card); border: 0; font-size: 0.88rem; }
body #resultsSection thead, body #resultsSection thead th { background: var(--mfp-surface-2) !important; color: var(--mfp-muted) !important; }
body #resultsSection thead th { font: 600 0.68rem var(--mfp-body); letter-spacing: 0.09em; }
body #resultsSection tbody td { font-variant-numeric: tabular-nums; border-color: var(--mfp-line); }
body #resultsSection tbody td.text-right, body #resultsSection tbody td:not(:first-child) { font-family: var(--mfp-mono); font-size: 0.82rem; }
.marker-row td { background-color: var(--mfp-surface-2) !important; color: var(--mfp-ink) !important; }
.interval-marker-row td { background-color: transparent !important; color: var(--mfp-muted) !important; }
.limit-reached-row td { background-color: var(--mfp-warn-bg) !important; color: var(--mfp-warn) !important; }

/* autocomplete */
.autocomplete-items { border: 1px solid var(--mfp-line); border-radius: var(--mfp-r-md); box-shadow: var(--mfp-lift); overflow: hidden; top: calc(100% + 4px); }
.autocomplete-items div { padding: 0.8rem 1rem; font-size: 0.95rem; border-bottom: 1px solid var(--mfp-line); }
.autocomplete-items div:hover { background-color: var(--mfp-surface-2); }
.autocomplete-active { background-color: var(--mfp-ink) !important; color: var(--mfp-on-ink) !important; }

@media (max-width: 640px) {
  body .input-group input[type="date"], body .input-group input[type="number"], body .input-group input[type="text"] { font-size: 16px; }
  body #grandTotalPerDiem { font-size: 1.8rem; }
}

/* headings outside <section> and the breakdown rows: no leftover sky-blue, no white/tinted mismatch on the sticky date column */
body h2, body h3 { color: var(--mfp-text) !important; }
body #resultsSection tbody td { background-color: var(--mfp-card) !important; }
body #resultsSection tbody tr:nth-child(even) td { background-color: #f6f9f3 !important; }
body #resultsSection tbody tr.marker-row td { background-color: var(--mfp-surface-2) !important; }
body #resultsSection tbody tr.limit-reached-row td { background-color: var(--mfp-warn-bg) !important; }
body #resultsSection tbody tr.interval-marker-row td { background-color: transparent !important; }
