/* ---------------------------------------------------------------------------
   CAM calculator (LT-22). Its own stylesheet, loaded only on the post that
   mounts the widget, so brand.css stays inside its line budget and nobody else
   downloads it. Own classes only — no Bootstrap utility that was not already in
   a template, so the purged bundle does not need rebuilding. Mobile first: panels stack, inputs are full
   width, numbers are tabular mono, result tables scroll inside their wrapper.
   --------------------------------------------------------------------------- */
.ls-calc { max-width: 68ch; margin-bottom: 2.5rem; }
.ls-calc__panel {
  background: var(--ls-page); border: 1px solid var(--ls-border);
  border-radius: var(--bs-border-radius); padding: 1.25rem 1rem; margin-bottom: 1.25rem;
}
@media (min-width: 768px) { .ls-calc__panel { padding: 1.5rem 1.5rem; } }
.ls-calc .form-control { font-family: var(--ls-mono); font-variant-numeric: tabular-nums; font-size: 1rem; }
.ls-calc .ls-calc__name { font-family: inherit; }
.ls-calc .form-label { margin-bottom: .25rem; }
.ls-calc__hint { margin-top: .3rem; font-size: .85rem; color: var(--ls-muted); }
.ls-calc__half { }
@media (min-width: 768px) { .ls-calc__half { flex: 0 0 auto; width: 25%; } }
.ls-calc__table th[scope="row"] { font-weight: 500; color: var(--ls-ink-2); }
.ls-calc__table td { font-family: var(--ls-mono); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.ls-calc__table td:has(> .form-control) { padding: .25rem .35rem; min-width: 7.5rem; }
.ls-calc__table tbody td .form-control { min-width: 6.5rem; }
.ls-calc__table .ls-calc__total th, .ls-calc__table .ls-calc__total td { font-weight: 600; color: var(--ls-ink); border-top: 2px solid var(--ls-border-2); }
.ls-calc__table [data-out="factor"], .ls-calc__table [data-out="tshare"] { display: inline-block; margin-left: .35rem; }
.ls-calc__neg { color: var(--ls-muted); }
.ls-calc__credit { color: var(--ls-good); }
.ls-calc__radios { display: flex; flex-direction: column; gap: .4rem; }
.ls-calc__radios label { display: flex; align-items: center; gap: .5rem; font-size: .95rem; color: var(--ls-ink-2); min-height: 44px; }
.ls-calc__radios input { width: 1.1rem; height: 1.1rem; accent-color: var(--ls-accent); flex: 0 0 auto; }
.ls-calc__actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.ls-calc__actions .btn { min-height: 44px; }
.ls-calc input:invalid, .ls-calc .is-bad { border-color: #9E3F2C; }
/* Narrow screens: the four-column tables must fit 390px without a side scroll.
   Inputs shrink, numbers go a size down, padding tightens; the scroll wrapper
   stays as the fallback for anything narrower than 360px. */
@media (max-width: 767.98px) {
  .ls-calc__panel { padding: 1rem .75rem; }
  .ls-calc__table { font-size: .85rem; }
  .ls-calc__table th, .ls-calc__table td { padding: .4rem .3rem; }
  .ls-calc__table td:has(> .form-control) { padding: .15rem .2rem; min-width: 0; }
  /* Inputs keep the site's control height (2.4rem); only their width shrinks. */
  .ls-calc__table tbody td .form-control { min-width: 0; width: 5.75rem; }
  .ls-calc__table thead th { font-size: .6rem; }
  .ls-calc__table th[scope="row"] { font-size: .85rem; min-width: 6rem; }
  /* Tenant rows: the name gets a full-width line of its own, then RSF, share
     and allocation sit on the line below. A five-word tenant name in a
     4.75rem box was unreadable. */
  .ls-calc__tenants thead { display: none; }
  .ls-calc__tenants tbody tr, .ls-calc__tenants tfoot tr { display: grid; grid-template-columns: 1fr auto auto; column-gap: .5rem; align-items: center; }
  .ls-calc__tenants tbody tr > :first-child, .ls-calc__tenants tfoot tr > :first-child { grid-column: 1 / -1; padding-bottom: 0; }
  .ls-calc__tenants tbody td .ls-calc__name { width: 100%; }
  .ls-calc__tenants tbody td:has(> .form-control) { padding-top: .15rem; }
  .ls-calc__tenants td, .ls-calc__tenants th { border: 0; box-shadow: none; }
  .ls-calc__tenants tbody tr { border-top: 1px solid var(--ls-border); padding: .35rem 0; }
  .ls-calc__tenants tbody td[data-t="share"]::before { content: "share "; font-family: var(--ls-sans, inherit); font-size: .65rem; color: var(--ls-muted); letter-spacing: .08em; text-transform: uppercase; }
  .ls-calc__tenants tbody td[data-t="rsf"] { justify-self: start; }
  .ls-calc__tenants tr.ls-calc__total { border-top: 2px solid var(--ls-border-2); }
  .ls-calc__tenants tfoot tr > :first-child { padding-bottom: .1rem; }
}