/* =============================================================================
   GATOR GOV, COST OF OWNERSHIP CALCULATOR
   Loaded only on /cost-of-ownership-calculator.
   Relies on the design tokens in style.css and the form primitives in
   configure.css (.cfg-form-grid, .fg, .cfg-btn, .privacy-row, .radio-set-inline).
   ============================================================================= */

/* An author-set `display` beats the UA stylesheet's `[hidden] { display: none }`,
   so toggling .hidden on anything styled `display: grid/flex/block` here would
   silently keep rendering it. This file only loads on the calculator, so make
   the attribute authoritative and kill that whole class of bug. */
[hidden] { display: none !important; }

/* ===== TABS ===== */
.calc-tabs {
  display: flex; gap: 0; max-width: 1200px; margin: 0 auto;
  padding: 28px 24px 0; border-bottom: 1px solid var(--border);
}
.calc-tab {
  appearance: none; background: transparent; cursor: pointer;
  font-family: var(--font-head); font-size: 0.92rem; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--silver);
  padding: 13px 22px; border: 1px solid var(--border); border-bottom: none;
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}
.calc-tab + .calc-tab { border-left: none; }
.calc-tab:hover { color: var(--white); }
.calc-tab[aria-selected="true"] {
  color: var(--white); background: var(--dark);
  border-color: var(--border-green); border-top: 2px solid var(--accent);
}
@media (max-width: 560px) {
  .calc-tabs { padding: 20px 16px 0; }
  .calc-tab { flex: 1; padding: 12px 8px; font-size: 0.78rem; letter-spacing: 0.08em; }
}

.calc-panel[hidden] { display: none; }

/* ===== LAYOUT ===== */
.calc-wrap { max-width: 1200px; margin: 0 auto; padding: 32px 24px 72px; }
.calc-grid { display: grid; grid-template-columns: 1fr 360px; gap: 32px; align-items: start; }
@media (max-width: 980px) { .calc-grid { grid-template-columns: 1fr; } }
.calc-main { min-width: 0; }

/* ===== INPUT GROUPS ===== */
.calc-group { border: 1px solid var(--border); background: var(--dark); margin-bottom: 18px; }
.calc-group-head {
  display: flex; align-items: baseline; gap: 12px;
  padding: 14px 18px; border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(74,122,37,0.14), transparent);
}
.calc-group-num {
  font-family: var(--font-head); font-size: 0.82rem; letter-spacing: 0.16em; color: var(--accent);
}
.calc-group-head h3 {
  font-family: var(--font-head); color: var(--white); text-transform: uppercase;
  letter-spacing: 0.05em; font-size: 1.02rem; margin: 0;
}
.calc-group-body { padding: 6px 18px 16px; }
.calc-group-note { font-size: 0.78rem; color: var(--silver); margin: 10px 0 0; line-height: 1.55; }

/* ===== INPUT ROWS ===== */
.calc-row {
  display: grid; grid-template-columns: 1fr 170px; gap: 14px;
  align-items: center; padding: 11px 0; border-bottom: 1px solid var(--border);
}
.calc-row:last-child { border-bottom: none; }
.calc-row-label { min-width: 0; }
.calc-row-label label { display: block; color: var(--silver-light); font-size: 0.92rem; }
.calc-row-hint { display: block; font-size: 0.75rem; color: var(--silver); margin-top: 2px; line-height: 1.45; }
@media (max-width: 560px) {
  .calc-row { grid-template-columns: 1fr; gap: 7px; align-items: stretch; }
}

.calc-field { position: relative; display: flex; align-items: center; }
.calc-field .calc-affix {
  position: absolute; font-size: 0.9rem; color: var(--silver); pointer-events: none;
}
.calc-field .calc-affix.pre { left: 11px; }
.calc-field .calc-affix.post { right: 11px; }
.calc-field input {
  width: 100%; background: var(--dark-2); border: 1px solid var(--border);
  color: var(--white); font-family: var(--font-body); font-size: 0.95rem;
  padding: 10px 12px; text-align: right;
}
.calc-field.has-pre input { padding-left: 24px; }
.calc-field.has-post input { padding-right: 26px; }
.calc-field input:focus { outline: none; border-color: var(--accent); }
.calc-field input.text-in { text-align: left; }

/* ===== RESULTS PANEL ===== */
.calc-results-col { position: sticky; top: 20px; }
.calc-results {
  background: var(--dark); border: 1px solid var(--border-green);
  box-shadow: 0 18px 44px rgba(0,0,0,0.35);
}
.calc-results-head {
  padding: 15px 18px; border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(74,122,37,0.16), transparent);
}
.calc-results-head h3 {
  font-family: var(--font-head); color: var(--white); text-transform: uppercase;
  letter-spacing: .06em; font-size: 1.05rem; margin: 0; display: flex; align-items: center; gap: 9px;
}
.calc-results-head h3 i { color: var(--accent); }

.calc-headline { padding: 20px 18px; text-align: center; border-bottom: 1px solid var(--border); }
.calc-headline-label {
  font-family: var(--font-head); font-size: 0.74rem; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--silver); display: block;
}
.calc-headline-value {
  font-family: var(--font-head); font-size: clamp(2.2rem, 6vw, 2.9rem); color: var(--accent);
  letter-spacing: 0.02em; line-height: 1.05; display: block; margin-top: 6px;
}
.calc-headline-sub { font-size: 0.8rem; color: var(--silver); margin: 6px 0 0; }

/* Empty state: every field starts blank, so the panel invites the first number
   rather than showing a hollow $0 total. */
.calc-empty-note {
  font-size: 0.84rem; color: var(--silver); margin: 10px auto 0;
  max-width: 30ch; line-height: 1.55;
}
.calc-empty-note[hidden] { display: none; }
.calc-results.is-empty .calc-headline-value { color: var(--dark-4); }
.calc-results.is-empty { box-shadow: none; border-color: var(--border); }
.calc-verdict.is-empty { border-color: var(--border); }
.calc-verdict.is-empty .calc-verdict-name { color: var(--silver-light); }

.calc-breakdown { padding: 6px 18px 12px; }
.calc-line {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 0.88rem;
}
.calc-line:last-child { border-bottom: none; }
.calc-line-key { color: var(--silver); }
.calc-line-val { color: var(--white); font-weight: 600; white-space: nowrap; }
.calc-line.credit .calc-line-val { color: var(--accent); }
.calc-line.total { border-top: 1px solid var(--border-green); margin-top: 4px; padding-top: 12px; }
.calc-line.total .calc-line-key { color: var(--white); font-family: var(--font-head); letter-spacing: 0.08em; text-transform: uppercase; }

.calc-metrics { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--border); }
.calc-metric { padding: 14px 12px; text-align: center; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.calc-metric:nth-child(2n) { border-right: none; }
.calc-metric:nth-last-child(-n+2) { border-bottom: none; }
.calc-metric .m-val { font-family: var(--font-head); font-size: 1.45rem; color: var(--white); letter-spacing: 0.02em; line-height: 1; }
.calc-metric .m-lbl { font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--silver); margin-top: 6px; }

.calc-results-foot { padding: 14px 18px; border-top: 1px solid var(--border); }
.calc-results-foot p { font-size: 0.75rem; color: var(--silver); margin: 0; line-height: 1.5; }
.calc-results-actions { display: grid; gap: 10px; margin-top: 14px; }
.calc-results-actions .cfg-btn { justify-content: center; }

/* ===== SCHEDULE TABLE ===== */
.calc-table-wrap { overflow-x: auto; border: 1px solid var(--border); background: var(--dark); }
.calc-table { width: 100%; border-collapse: collapse; min-width: 520px; font-size: 0.88rem; }
.calc-table caption {
  text-align: left; padding: 14px 18px; border-bottom: 1px solid var(--border);
  font-family: var(--font-head); color: var(--white); text-transform: uppercase;
  letter-spacing: 0.05em; font-size: 1.02rem;
  background: linear-gradient(180deg, rgba(74,122,37,0.14), transparent);
}
.calc-table th, .calc-table td { padding: 11px 18px; text-align: right; border-bottom: 1px solid var(--border); }
.calc-table th:first-child, .calc-table td:first-child { text-align: left; }
.calc-table thead th {
  font-family: var(--font-head); font-weight: 400; color: var(--silver);
  letter-spacing: 0.1em; text-transform: uppercase; font-size: 0.74rem;
}
.calc-table tbody td { color: var(--silver-light); }
.calc-table tbody tr:last-child td { border-bottom: none; }
.calc-table tbody tr.is-final td { color: var(--white); font-weight: 600; border-top: 1px solid var(--border-green); }
.calc-table tbody tr.is-final td:first-child { font-family: var(--font-head); letter-spacing: 0.06em; text-transform: uppercase; font-weight: 400; }

/* ===== COMPARE ===== */
.calc-compare-wrap { overflow-x: auto; border: 1px solid var(--border); background: var(--dark); }
.calc-compare { width: 100%; border-collapse: collapse; min-width: 620px; }
.calc-compare th, .calc-compare td { padding: 10px 16px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.calc-compare thead th {
  font-family: var(--font-head); font-weight: 400; color: var(--white);
  letter-spacing: 0.08em; text-transform: uppercase; font-size: 0.86rem; text-align: center;
  background: linear-gradient(180deg, rgba(74,122,37,0.14), transparent);
}
.calc-compare thead th:first-child { text-align: left; color: var(--silver); }
.calc-compare tbody th {
  font-weight: 400; text-align: left; color: var(--silver-light); font-size: 0.9rem; width: 34%;
}
.calc-compare tbody td { width: 33%; }
.calc-compare tbody tr.is-credit th { color: var(--accent); }
.calc-compare tfoot td, .calc-compare tfoot th {
  border-top: 1px solid var(--border-green); border-bottom: none;
  padding-top: 15px; padding-bottom: 15px;
}
.calc-compare tfoot th {
  font-family: var(--font-head); letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--white); font-size: 0.92rem; font-weight: 400;
}
.calc-compare-total {
  display: block; text-align: center; font-family: var(--font-head);
  font-size: 1.6rem; color: var(--white); letter-spacing: 0.02em; line-height: 1;
}
.calc-compare-total.is-winner { color: var(--accent); }
.calc-compare-flag {
  display: block; text-align: center; font-size: 0.68rem; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--accent); margin-top: 7px; min-height: 1em;
}

.calc-verdict {
  margin-top: 18px; border: 1px solid var(--border-green); background: var(--dark);
  padding: 20px 22px; text-align: center;
}
.calc-verdict-eyebrow {
  font-family: var(--font-head); font-size: 0.74rem; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--silver); display: block;
}
.calc-verdict-name {
  font-family: var(--font-head); font-size: clamp(1.5rem, 4vw, 2rem); color: var(--accent);
  text-transform: uppercase; letter-spacing: 0.03em; display: block; margin: 6px 0 4px; line-height: 1.1;
}
.calc-verdict-sub { color: var(--silver-light); font-size: 0.95rem; margin: 0; }
.calc-verdict-note { color: var(--silver); font-size: 0.82rem; margin: 12px auto 0; max-width: 56ch; line-height: 1.6; }

/* ===== CHECKLIST ===== */
.calc-check-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
@media (max-width: 720px) { .calc-check-grid { grid-template-columns: 1fr; } }
.calc-check {
  border: 1px solid var(--border); background: var(--dark-2); padding: 18px;
}
.calc-check i { color: var(--accent); font-size: 1.1rem; }
.calc-check h3 {
  font-family: var(--font-head); color: var(--white); text-transform: uppercase;
  letter-spacing: 0.04em; font-size: 0.98rem; margin: 10px 0 6px;
}
.calc-check p { margin: 0; font-size: 0.9rem; color: var(--silver-light); line-height: 1.6; }

/* ===== GLOSSARY ===== */
.calc-terms { display: grid; gap: 0; border: 1px solid var(--border); background: var(--dark); }
.calc-term {
  display: grid; grid-template-columns: 220px 1fr; gap: 18px;
  padding: 15px 18px; border-bottom: 1px solid var(--border);
}
.calc-term:last-child { border-bottom: none; }
.calc-term dt {
  font-family: var(--font-head); color: var(--white); text-transform: uppercase;
  letter-spacing: 0.06em; font-size: 0.95rem;
}
.calc-term dd { margin: 0; color: var(--silver-light); font-size: 0.94rem; line-height: 1.6; }
@media (max-width: 620px) { .calc-term { grid-template-columns: 1fr; gap: 5px; } }

/* ===== STEPS ===== */
.calc-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
@media (max-width: 900px) { .calc-steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .calc-steps { grid-template-columns: 1fr; } }
.calc-step-card { border: 1px solid var(--border); background: var(--dark-2); padding: 16px; }
.calc-step-card .n {
  font-family: var(--font-head); color: var(--accent); font-size: 1.5rem; line-height: 1; letter-spacing: 0.04em;
}
.calc-step-card p { margin: 8px 0 0; font-size: 0.88rem; color: var(--silver-light); line-height: 1.55; }

/* ===== DISCLAIMER ===== */
.calc-disclaimer {
  border-left: 2px solid var(--green); background: var(--dark-2);
  padding: 16px 18px; margin-top: 22px;
}
.calc-disclaimer p { margin: 0; font-size: 0.86rem; color: var(--silver-light); line-height: 1.65; }
.calc-disclaimer strong { color: var(--white); }

/* ===== QUOTE FORM ===== */
.calc-form-section { scroll-margin-top: 20px; }
.calc-form-card {
  max-width: 780px; margin: 0 auto; border: 1px solid var(--border-green);
  background: var(--dark); padding: 26px;
}
.calc-form-card h2 {
  font-family: var(--font-head); color: var(--white); text-transform: uppercase;
  letter-spacing: 0.04em; font-size: clamp(1.4rem, 3vw, 1.8rem); margin: 0 0 6px;
}
.calc-form-card > p.lead { color: var(--silver-light); margin: 0 0 20px; font-size: 0.98rem; }
.calc-form-recap {
  border: 1px solid var(--border); background: var(--dark-2); padding: 14px 16px; margin-bottom: 20px;
}
.calc-form-recap .r-lbl {
  font-family: var(--font-head); font-size: 0.72rem; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--silver); display: block; margin-bottom: 4px;
}
.calc-form-recap .r-val { color: var(--white); font-size: 1.02rem; font-weight: 600; }
.calc-form-error { color: #e07a6d; font-size: 0.88rem; margin: 14px 0 0; text-align: center; }
.calc-form-submit { margin-top: 18px; }
.calc-form-submit .cfg-btn { width: 100%; justify-content: center; }

.calc-success { max-width: 640px; margin: 0 auto; padding: 20px 24px 10px; text-align: center; }
.calc-success .success-check {
  width: 72px; height: 72px; margin: 0 auto 18px; border: 2px solid var(--border-green);
  display: flex; align-items: center; justify-content: center; background: var(--dark-2);
}
.calc-success .success-check i { color: var(--accent); font-size: 2rem; }
.calc-success h2 {
  font-family: var(--font-head); color: var(--white); text-transform: uppercase;
  letter-spacing: 0.04em; font-size: clamp(1.5rem, 3.4vw, 2rem); margin: 0 0 10px;
}
.calc-success p { color: var(--silver-light); margin: 0 auto; max-width: 52ch; }

/* ===== PRINT ===== */
@media print {
  .site-topbar, .site-footer, .lp-breadcrumb, .calc-tabs, .lp-cta,
  .calc-results-actions, .calc-form-section, .scroll-progress,
  .mobile-sticky-cta, .lp-related { display: none !important; }
  body, body.lp { background: #fff !important; color: #111 !important; }
  .calc-grid { grid-template-columns: 1fr !important; }
  .calc-results-col { position: static !important; }
  .calc-group, .calc-results, .calc-table-wrap, .calc-compare-wrap,
  .calc-terms, .calc-check, .calc-step-card, .calc-disclaimer, .calc-verdict {
    background: #fff !important; border-color: #ccc !important; box-shadow: none !important;
  }
  .calc-group-head, .calc-results-head, .calc-table caption, .calc-compare thead th { background: #f2f2f2 !important; }
  .calc-headline-value, .calc-verdict-name, .calc-compare-total.is-winner,
  .calc-step-card .n, .calc-group-num, .calc-check i { color: #2f5417 !important; }
  h1, h2, h3, .calc-line-val, .calc-metric .m-val, .calc-table tbody tr.is-final td { color: #111 !important; }
  .calc-line-key, .calc-metric .m-lbl, .calc-table tbody td, .calc-term dd,
  .calc-check p, .calc-disclaimer p, .lp-prose, .lp-prose p { color: #333 !important; }
  .calc-field input { color: #111 !important; background: #fff !important; border-color: #bbb !important; }
  .lp-section { padding: 18px 0; border: none; }
  .calc-panel[hidden] { display: none !important; }
}