/* mbc-calculators — scoped under .mbc. Inherits the theme's font; sets only what the tool needs.
   v0.11.2: repainted to the mybuildingcalculators brand (primary #16181D, accent #A3E635,
   Manrope body / Archivo display). Every colour is a local variable with a hard value, so the
   plugin still looks right if it is ever loaded outside the MBC theme. Class names and the print
   block are unchanged. */
.mbc { --mbc-ink:#0D0E11; --mbc-line:#E3E5E0; --mbc-field:#fff; --mbc-out:#fff; --mbc-accent:#16181D; --mbc-lime:#A3E635; --mbc-warn:#8A3B12; --mbc-warn-bg:#FBEEE4; --mbc-muted:#5B5F6B; --mbc-soft:#F7F8F5;
       --mbc-display-face:"Archivo","Manrope",system-ui,sans-serif;
       color:var(--mbc-ink); max-width:60rem; margin:0 auto; line-height:1.55; }
/* v0.11.37: the page stylesheet's `.mbc{margin:0}` (one class, loaded later) cancelled `margin:0 auto` above, so every
   tool sat flush left at 960 px instead of in the 800 px content column. Two-class selector wins on every page. */
.mbc.mbc-calc { max-width:800px; margin-left:auto; margin-right:auto; }
.mbc *, .mbc *::before, .mbc *::after { box-sizing:border-box; }
.mbc [hidden] { display:none !important; }
.mbc-title { font-family:var(--mbc-display-face); font-weight:700; font-size:1.85rem; line-height:1.2; letter-spacing:-.02em; color:var(--mbc-ink); margin:0 0 1.1rem; }
/* Same text, rendered as <p> so it adds no heading to the page outline. Looks identical. */
p.mbc-title-plain { font-size:1.85rem; font-weight:700; margin:0 0 1.1rem; }
.mbc-tool { display:grid; gap:1.5rem; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; }
@media (max-width:640px) { .mbc-tool { grid-template-columns:1fr; } }
.mbc-panel-in { display:flex; flex-direction:column; }
.mbc-inputs { display:grid; gap:1rem; }
.mbc-field { display:grid; gap:.3rem; }
.mbc-field label { font-weight:700; font-size:.95em; }
.mbc-unit { font-weight:400; color:var(--mbc-muted); }
.mbc-field input:not([type=checkbox]), .mbc-field select {
  width:100%; padding:.65rem .8rem; border:1px solid var(--mbc-line); border-radius:10px; background:var(--mbc-field);
  font:inherit; color:inherit; transition:border-color .12s ease, box-shadow .12s ease; }
.mbc-field input:not([type=checkbox]):hover, .mbc-field select:hover { border-color:#C9CDC6; }
.mbc-field input:focus, .mbc-field select:focus { border-color:var(--mbc-accent); box-shadow:0 0 0 3px rgba(163,230,53,.35); outline:none; }
.mbc-field input:focus-visible, .mbc-field select:focus-visible, .mbc-btn:focus-visible { outline:2px solid var(--mbc-accent); outline-offset:2px; }
.mbc-field [aria-invalid] { border-color:var(--mbc-warn); }
.mbc-field-toggle label { display:flex; gap:.55rem; align-items:center; font-weight:500; }
.mbc-field input[type=checkbox] { accent-color:var(--mbc-accent); width:1.05em; height:1.05em; }
.mbc-help { font-size:.85em; color:var(--mbc-muted); }
.mbc-err { font-size:.85em; color:var(--mbc-warn); min-height:1em; }
.mbc-err:empty { display:none; }

.mbc-panel-out { background:var(--mbc-out); border:1px solid var(--mbc-line); border-radius:14px;
  box-shadow:0 1px 2px rgba(13,14,17,.05), 0 8px 24px rgba(13,14,17,.06); padding:1.4rem 1.5rem; }
.mbc-primary { display:grid; gap:.15rem; background:var(--mbc-soft); border-left:4px solid var(--mbc-lime);
  border-radius:0 10px 10px 0; padding:.9rem 1rem; margin:0 0 1.15rem; }
.mbc-primary-label { color:var(--mbc-muted); font-size:.9em; }
.mbc-primary-value { font-family:var(--mbc-display-face); font-size:2.35rem; font-weight:700; line-height:1.1; letter-spacing:-.02em; color:var(--mbc-ink); }
.mbc-secondary { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.5rem 1rem; margin:0 0 1.15rem; font-size:.97em; }
.mbc-secondary dt { color:var(--mbc-muted); }
.mbc-secondary dd { margin:0; font-weight:700; text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.mbc-table { width:100%; border-collapse:collapse; margin:0 0 1.15rem; font-size:.94em; }
.mbc-table th, .mbc-table td { text-align:left; padding:.55rem .6rem; border-bottom:1px solid var(--mbc-line); }
.mbc-table th { font-weight:700; color:var(--mbc-muted); font-size:.82em; letter-spacing:.06em; text-transform:uppercase; }
.mbc-table td { font-variant-numeric:tabular-nums; }
/* v0.11.32: card tables never run past the result card (row 32 live QA, 5-col degrees table overflowed at 1440). */
.mbc-table-wrap { max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; margin:0 0 1.15rem; }
.mbc-table-wrap > .mbc-table { margin:0; }
.mbc-panel-out .mbc-table { font-size:.9em; }
.mbc-panel-out .mbc-table th, .mbc-panel-out .mbc-table td { padding:.5rem .3rem; }
.mbc-panel-out .mbc-table th { letter-spacing:.02em; }
.mbc-row-best td { font-weight:700; background:rgba(163,230,53,.16); }
.mbc-row-best td:first-child { box-shadow:inset 3px 0 0 var(--mbc-lime); }
.mbc-warn { background:var(--mbc-warn-bg); color:var(--mbc-warn); border-left:3px solid var(--mbc-warn); padding:.7rem .9rem; border-radius:0 10px 10px 0; margin:0 0 .85rem; font-size:.95em; }
.mbc-note, .mbc-muted { color:var(--mbc-muted); font-size:.9em; margin:.25rem 0; }
.mbc-actions { margin-top:.75rem; }
.mbc-figure { margin:0 0 1.15rem; background:#fff; border:1px solid var(--mbc-line); border-radius:10px; padding:.6rem; }
.mbc-figure svg { display:block; width:100%; height:auto; font-family:inherit; }
.mbc-btn { font:inherit; font-weight:700; font-size:.93em; padding:.6rem 1.15rem; border:1px solid var(--mbc-accent);
  background:transparent; color:var(--mbc-accent); border-radius:999px; cursor:pointer; transition:background .12s ease, color .12s ease; }
.mbc-btn:hover { background:var(--mbc-accent); color:#fff; }

.mbc-footer { margin-top:1.9rem; font-size:.9em; }
.mbc-assumptions summary { font-weight:700; cursor:pointer; }
.mbc-assumptions summary::marker { color:var(--mbc-muted); }
.mbc-assumptions ul { margin:.5rem 0 0 1.2rem; padding:0; }
/* Themes (incl. the staging theme) style list items / ::marker link-blue with .entry-content specificity;
   the theme-isolation rule only neutralises elements OUTSIDE .mbc, so pin these explicitly. */
.mbc-assumptions li, .mbc-footer li { color:var(--mbc-ink); }
.mbc-assumptions li::marker, .mbc-footer li::marker { color:var(--mbc-lime); }
.mbc-cite { color:var(--mbc-muted); }
.mbc-disclaimer { border-top:1px solid var(--mbc-line); padding-top:.85rem; margin-top:.85rem; color:var(--mbc-muted); }
.mbc-fatal { color:var(--mbc-warn); }

@media print {
  .mbc-table-wrap { overflow:visible; }
  /* Print only the calculator: hide every element that neither contains nor sits inside .mbc (theme header, footer, sidebars),
     and un-stick its ancestors so a sticky header cannot overprint the results. Needs :has() — Chrome 105+, Safari 15.4+, Firefox 121+. */
  body *:not(.mbc):not(.mbc *):not(:has(.mbc)) { display:none !important; }
  body *:has(.mbc) { position:static !important; overflow:visible !important; max-width:none !important; padding:0 !important; margin:0 !important; }
  /* The rule above isolates the calculators from the THEME. It does NOT isolate one calculator from
     another — every .mbc survives it, so a page with several tools printed all of them (found on the
     batch G staging page, 11 tools = 15 pages). printOnly() in calc-core.js marks the clicked tool
     and this rule drops the rest for the duration of the print. */
  /* v0.11.18: tool pages wrap every content block in <div class="mbc mbc-wrap800">, so the calculator root sits INSIDE a .mbc
     that is not .mbc-print-me — the old rule hid that wrapper and the print came out blank on every tool page (found 27 Sep 2026,
     bags page). Keep any .mbc that contains the printed tool, then drop the wrapper's other children (H2s, paragraphs, tables). */
  body.mbc-printing .mbc:not(.mbc-print-me):not(:has(.mbc-print-me)) { display:none !important; }
  body.mbc-printing .mbc:has(.mbc-print-me) > *:not(.mbc-print-me):not(:has(.mbc-print-me)) { display:none !important; }
  .mbc-panel-in, .mbc-actions { display:none; }
  .mbc-title { font-size:1.4rem; margin:0 0 .8rem; }
  .mbc-tool { grid-template-columns:1fr; }
  .mbc-panel-out { background:none; border:none; box-shadow:none; padding:0; }
  .mbc-primary { background:none; border-left:3px solid #000; border-radius:0; padding:0 0 0 .6rem; }
  .mbc-row-best td { background:none; }
  .mbc-row-best td:first-child { box-shadow:none; }
  .mbc-figure { border:none; padding:0; break-inside:avoid; }
}
.mbc-nowrap { white-space:nowrap; }

/* v0.11.40: panels never grow past the card on phones; wide result tables scroll inside .mbc-table-wrap (lumber chart overflowed 26 px at 390). */
.mbc-panel { min-width:0; }
