/* ============================================================
   LUMIOTAX — Tool-specific components (normative, results, didactic)
   ============================================================ */

/* ---------- Result panel ---------- */
.result-hero { text-align: center; padding: var(--sp-5) var(--sp-5) var(--sp-4); }
.result-hero .res-label { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .14em; color: var(--ink-300); }
.result-hero .res-big { font-family: var(--font-mono); font-size: clamp(2rem, 4.4vw, 2.6rem); font-weight: 700; letter-spacing: -0.04em; margin: .3rem 0; }
.result-hero .res-big.refund { color: var(--jade-400); }
.result-hero .res-big.owe { color: #FF8B7A; }
.result-hero .res-sub { font-size: var(--fs-sm); color: var(--ink-200); }

.mini-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--sp-2); padding: var(--sp-4) var(--sp-5); border-top: 1px solid rgba(255,255,255,.08); }
.mini-stat { display: flex; flex-direction: column; gap: 2px; }
.mini-lbl { font-size: 0.66rem; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-300); }
.mini-val { font-size: var(--fs-md); color: #fff; }
.mini-val.good { color: var(--jade-400); }
.mini-val.amber { color: var(--amber-400); }

.breakdown-wrap { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: var(--sp-5) var(--sp-6); margin-top: var(--sp-4); }
.breakdown-wrap h4 { font-family: var(--font-sans); font-weight: 650; font-size: var(--fs-base); margin-bottom: var(--sp-2); }

/* ---------- Normative accordion ---------- */
.normative-block { margin-top: var(--sp-7); }
.normative-block > .nb-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-4); margin-bottom: var(--sp-4); flex-wrap: wrap; }
.normative-block h3 { font-family: var(--font-sans); font-weight: 650; font-size: var(--fs-lg); }
.normative-block .nb-note { font-size: var(--fs-xs); color: var(--text-faint); max-width: 46ch; }

.norm-item { border: 1px solid var(--border); border-radius: var(--r-md); margin-bottom: var(--sp-3); background: var(--surface); overflow: hidden; transition: border-color var(--dur) var(--ease); }
.norm-item[open] { border-color: var(--border-strong); box-shadow: var(--shadow-sm); }
.norm-item summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-4) var(--sp-5); user-select: none; }
.norm-item summary::-webkit-details-marker { display: none; }
.norm-ref { font-family: var(--font-mono); font-size: var(--fs-xs); font-weight: 700; color: var(--jade-700); background: var(--jade-100); padding: .2rem .55rem; border-radius: var(--r-sm); white-space: nowrap; }
[data-theme="dark"] .norm-ref { background: rgba(15,181,166,.14); color: var(--jade-400); }
.norm-title { font-weight: 600; font-size: var(--fs-sm); flex: 1; }
.norm-chev { color: var(--text-faint); font-family: var(--font-mono); transition: transform var(--dur) var(--ease); }
.norm-item[open] .norm-chev { transform: rotate(45deg); }
.norm-body { padding: 0 var(--sp-5) var(--sp-5) var(--sp-5); font-size: var(--fs-sm); color: var(--text-soft); line-height: 1.7; }
.norm-body p { margin-bottom: .7rem; color: var(--text-soft); }
.norm-body strong { color: var(--text); font-weight: 650; }
.norm-body code { font-family: var(--font-mono); font-size: .85em; background: var(--surface-2); padding: .1rem .4rem; border-radius: 4px; color: var(--jade-700); }
[data-theme="dark"] .norm-body code { color: var(--jade-400); }
.norm-body .cite { display: inline-block; margin-top: .3rem; font-size: var(--fs-xs); color: var(--text-faint); font-style: italic; }
.norm-body ul { margin: .4rem 0 .8rem 1.1rem; }
.norm-body li { margin-bottom: .35rem; }

/* ---------- Didactic / explainer ---------- */
.explainer { background: var(--bg-soft); border: 1px solid var(--border); border-radius: var(--r-lg); padding: var(--sp-6); margin-top: var(--sp-5); }
.explainer h4 { font-family: var(--font-sans); font-weight: 650; margin-bottom: var(--sp-2); }
.explainer ol { margin-left: 1.1rem; }
.explainer li { margin-bottom: .5rem; color: var(--text-soft); font-size: var(--fs-sm); }

/* ---------- Column mapper (smart ingestion) ---------- */
.colmap { background: var(--surface); border: 1px solid var(--jade-600); border-radius: var(--r-lg); padding: var(--sp-5); margin-top: var(--sp-4); box-shadow: var(--shadow-md); }
.colmap h4 { font-family: var(--font-sans); font-weight: 650; }
.colmap-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: var(--sp-3); margin-top: var(--sp-3); }
.colmap .field label { font-size: var(--fs-xs); }

/* ---------- Client bar (workspace integration) ---------- */
.client-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap;
  background: linear-gradient(120deg, var(--jade-100), var(--amber-100)); border: 1px solid var(--border);
  border-radius: var(--r-md); padding: var(--sp-3) var(--sp-5); margin-bottom: var(--sp-5); }
[data-theme="dark"] .client-bar { background: linear-gradient(120deg, rgba(15,181,166,.12), rgba(244,178,62,.10)); }
.client-bar .cb-who { font-size: var(--fs-sm); }
.client-bar .cb-who b { font-weight: 700; }
.client-bar .cb-who .cb-pill { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--jade-700); }
[data-theme="dark"] .client-bar .cb-who .cb-pill { color: var(--jade-400); }
.client-bar .cb-actions { display: flex; gap: var(--sp-2); align-items: center; }
.client-bar .cb-saved { font-size: var(--fs-xs); color: var(--good); font-weight: 600; }

/* ---------- Disclaimer strip ---------- */
.tool-disclaimer { margin-top: var(--sp-6); font-size: var(--fs-xs); color: var(--text-faint); border-top: 1px solid var(--border); padding-top: var(--sp-4); line-height: 1.6; }

/* ---------- Print ---------- */
@media print {
  .nav, .footer, .tool-actions, [data-lumiotax-nav], [data-theme-toggle], .lang-toggle, .badge-pro { display: none !important; }
  body { background: #fff; }
  .tool-layout { grid-template-columns: 1fr; }
  .result-panel { background: #fff !important; color: #000 !important; border: 2px solid #000; box-shadow: none; }
  .result-hero .res-big, .result-hero .res-label, .result-hero .res-sub, .mini-val, .mini-lbl { color: #000 !important; }
  .norm-item { break-inside: avoid; }
  .normative-block details { open: true; }
}

/* ── Time-saved badge (conversion nudge after a tool produces output) ── */
.time-saved{display:flex;align-items:center;gap:var(--sp-4);margin-top:var(--sp-5);
  padding:var(--sp-4) var(--sp-5);border-radius:var(--r-lg);
  background:linear-gradient(100deg,var(--jade-100),var(--amber-100));
  border:1px solid var(--jade-400)}
[data-theme="dark"] .time-saved{background:linear-gradient(100deg,rgba(15,181,166,.12),rgba(245,180,60,.10));border-color:rgba(15,181,166,.35)}
.time-saved .ts-icon{font-size:1.5rem;line-height:1;flex-shrink:0}
.time-saved .ts-body{flex:1;min-width:0}
.time-saved .ts-main{font-family:var(--font-sans);font-weight:650;font-size:var(--fs-md);color:var(--text)}
.time-saved .ts-note{font-size:var(--fs-xs);color:var(--text-faint);margin-top:.1rem}
.time-saved .ts-cta{flex-shrink:0;font-size:var(--fs-sm);font-weight:600;color:var(--jade-700);
  text-decoration:none;white-space:nowrap}
.time-saved .ts-cta:hover{text-decoration:underline}
[data-theme="dark"] .time-saved .ts-cta{color:var(--jade-400)}
@media(max-width:560px){.time-saved{flex-wrap:wrap}.time-saved .ts-cta{flex-basis:100%}}
@media print{.time-saved{display:none}}

/* Free-calculators hub + related-tools strips (these pages don't load landing.css) */
.tool-page .tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
@media(max-width:900px){.tool-page .tool-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.tool-page .tool-grid{grid-template-columns:1fr}}
.tool-page .tool-grid .tool-card{display:flex;flex-direction:column}