/* Calculator styles. Everything is scoped under .smlu-calc and written by
   hand: static/css/tailwind.min.css is purged at build time, so a utility
   class that no template already uses would not exist. Loaded only on pages
   that carry a calculator. "div.smlu-calc" (not ".smlu-calc") so these rules
   outrank the .article-body rules in article.html, which load later. */
div.smlu-calc { margin: 1.5rem 0 2rem; padding: 1.25rem; border: 2px solid #17A2B8; border-radius: 0.5rem; background: #f8fafc; }
div.smlu-calc * { box-sizing: border-box; }
div.smlu-calc .smlu-calc-form { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 640px) { .smlu-calc .smlu-calc-form { grid-template-columns: 1fr 1fr; } }
div.smlu-calc .smlu-calc-field[hidden] { display: none; }
div.smlu-calc label { display: block; margin-bottom: 0.25rem; font-weight: 600; font-size: 0.95rem; color: #1f2937; }
div.smlu-calc input, .smlu-calc select { width: 100%; padding: 0.5rem 0.75rem; font-size: 1rem; color: #111827; background: #fff; border: 1px solid #d1d5db; border-radius: 0.375rem; }
div.smlu-calc input:focus, .smlu-calc select:focus { outline: 2px solid #17A2B8; outline-offset: 1px; }
div.smlu-calc small { display: block; margin-top: 0.25rem; font-size: 0.8rem; color: #6b7280; }
div.smlu-calc .smlu-calc-result { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid #e5e7eb; }
div.smlu-calc .smlu-calc-result p { margin: 0 0 0.5rem; color: #374151; }
div.smlu-calc .smlu-calc-range { font-size: 1.6rem; font-weight: 700; color: #1f2937; }
div.smlu-calc .smlu-calc-error { color: #b91c1c; font-weight: 600; }
div.smlu-calc .smlu-calc-line { display: flex; justify-content: space-between; gap: 1rem; padding: 0.35rem 0; border-bottom: 1px dashed #e5e7eb; color: #374151; }
div.smlu-calc .smlu-calc-line strong { color: #1f2937; white-space: nowrap; }
div.smlu-calc details { margin-top: 1rem; }
div.smlu-calc summary { cursor: pointer; font-weight: 600; color: #17A2B8; }
div.smlu-calc .smlu-calc-sources ul { margin: 0.5rem 0 0; padding-left: 1.25rem; font-size: 0.85rem; color: #4b5563; }
div.smlu-calc .smlu-calc-sources li { margin-bottom: 0.25rem; overflow-wrap: anywhere; }
div.smlu-calc .smlu-calc-print { margin: 0.75rem 0; padding: 0.4rem 0.9rem; font-weight: 600; color: #fff; background: #17A2B8; border: 0; border-radius: 0.375rem; cursor: pointer; }
div.smlu-calc .smlu-calc-scroll { max-height: 24rem; overflow: auto; }
div.smlu-calc table { width: 100%; margin: 0; border-collapse: collapse; font-size: 0.85rem; }
div.smlu-calc th, .smlu-calc td { padding: 0.3rem 0.5rem; text-align: right; border: 1px solid #e5e7eb; background: #fff; }
div.smlu-calc th { position: sticky; top: 0; background: #f3f4f6; }
@media print {
  div.smlu-calc .smlu-calc-scroll { max-height: none; overflow: visible; }
  div.smlu-calc .smlu-calc-print, .smlu-calc .smlu-calc-form { display: none; }
  div.smlu-calc details > * { display: block; }
}
