/* kalkulator.css — Stile des eingebetteten bAV-Aufwandskalkulators */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
  :root {
    --font-display: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, system-ui, sans-serif;
    --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, system-ui, sans-serif;
    --ink: #26302b; --green: #1a5346; --green-dk: #143f37; --gold: #cf9b12; --gold-lt: #fcc93b;
    --emp: #1f6e54; --emp-lt: #e6f1ea; --emp-bd: #cfe3d9;
    --comp: #1a5346; --comp-lt: #e7f1ec; --comp-bd: #bfe1cd;
    --text: #26302b; --muted: #5f6c66; --line: #e6e2d6; --bg: transparent;
  }
  body { font-family: var(--font-body); background: var(--bg); color: var(--text); -webkit-font-smoothing: antialiased; }
  /* klare, tabellarisch ausgerichtete Ziffern überall im Rechner */
  .bs-val, .sr-val, .dc-val, .legend-val, .input-wrap input, .scen-table td, .r-teilnehmer { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; letter-spacing: 0; }

  .container { max-width: 940px; margin: 0 auto; padding: 4px 4px 8px; position: relative; }

  /* ---------- CARD ---------- */
  .card { background:#fffdf8; border-radius:22px; box-shadow: 0 12px 40px rgba(20,59,44,0.10), 0 2px 8px rgba(20,59,44,0.04); margin-bottom:22px; overflow:hidden; }
  .card-head { padding:22px 28px 0; }
  .card-head h2 { font-family:var(--font-display); font-size:20px; font-weight:700; color:var(--ink); letter-spacing:-.3px; display:flex; align-items:center; gap:11px; }
  .card-head .pip { width:30px; height:30px; border-radius:9px; display:grid; place-items:center; flex-shrink:0; }
  .card-head .sub { font-size:13.5px; color:var(--muted); margin:5px 0 0 41px; }
  .card-body { padding:22px 28px 28px; }

  /* ---------- INPUTS ---------- */
  .input-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  @media(max-width:600px){.input-grid{grid-template-columns:1fr}}
  .field label { font-size:11px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:var(--muted); display:flex; align-items:center; gap:7px; margin-bottom:7px; }
  .locked-badge { font-size:9px; background:var(--line); color:var(--muted); padding:2px 7px; border-radius:10px; font-weight:700; letter-spacing:.5px; }
  .input-wrap { position:relative; display:flex; align-items:center; }
  .input-wrap input { width:100%; padding:13px 40px 13px 15px; border:1.5px solid var(--line); border-radius:13px; font-family:var(--font-display); font-size:16px; font-weight:600; color:var(--ink); background:#fbf9f2; transition:.2s; outline:none; }
  .input-wrap input:focus { border-color:var(--green); box-shadow:0 0 0 4px rgba(26,83,70,0.12); background:#fff; }
  .input-wrap .unit { position:absolute; right:14px; font-size:13px; font-weight:600; color:var(--muted); pointer-events:none; }
  .field-locked .input-wrap input { background:#f3f6f4; color:var(--muted); cursor:not-allowed; border-style:dashed; }

  /* ---------- BIG STAT BOX ---------- */
  .box-intro { font-size:14px; color:var(--muted); line-height:1.55; margin:24px 0 14px; }
  .big-stat { border-radius:20px; padding:24px; color:#fff; position:relative; overflow:hidden; }
  .big-stat.emp { background: linear-gradient(135deg, #1f7a5c 0%, #145140 100%); }
  .big-stat.comp { background: linear-gradient(135deg, #19604c 0%, #0e2f27 100%); }
  .big-stat::after { content:''; position:absolute; top:-40px; right:-40px; width:150px; height:150px; border-radius:50%; background:rgba(255,255,255,0.08); }
  .big-stat .bs-tag { font-size:11px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; opacity:.85; }
  .big-stat .bs-val { font-family:var(--font-display); font-size:40px; font-weight:800; letter-spacing:-1px; margin:8px 0 2px; line-height:1; }
  .big-stat .bs-sub { font-size:13px; opacity:.72; }

  /* ---------- DETAIL STAT ROWS ---------- */
  .stat-rows { display:flex; flex-direction:column; gap:0; }
  .stat-row { display:flex; align-items:baseline; justify-content:space-between; padding:13px 0; border-bottom:1px solid var(--line); gap:12px; }
  .stat-row:last-child { border-bottom:none; }
  .sr-label { font-size:14px; color:var(--text); font-weight:500; }
  .sr-right { text-align:right; flex-shrink:0; }
  .sr-val { font-family:var(--font-display); font-size:17px; font-weight:700; color:var(--ink); }
  .sr-year { font-size:11px; color:var(--muted); margin-top:1px; }
  .accent-bar { width:4px; align-self:stretch; border-radius:4px; }
  .emp-accent { background: var(--gold); }
  .comp-accent { background: var(--green); }

  /* ---------- DONUT ---------- */
  .section-label { display:flex; align-items:center; gap:10px; margin:6px 0 18px; color:var(--muted); font-size:11px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; }
  .section-label::after { content:''; flex:1; height:1px; background:var(--line); }
  .chart-wrap { display:flex; align-items:center; gap:34px; flex-wrap:wrap; }
  .donut-container { position:relative; width:170px; height:170px; flex-shrink:0; }
  canvas#donut { width:170px !important; height:170px !important; }
  .donut-center { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; pointer-events:none; }
  .dc-val { font-family:var(--font-display); font-size:19px; font-weight:800; color:var(--ink); line-height:1; }
  .dc-lbl { font-size:10px; color:var(--muted); font-weight:600; letter-spacing:.6px; text-transform:uppercase; margin-top:4px; }
  .legend { display:flex; flex-direction:column; gap:11px; flex:1; min-width:200px; }
  .legend-item { display:flex; align-items:center; gap:11px; }
  .legend-dot { width:11px; height:11px; border-radius:4px; flex-shrink:0; }
  .legend-text { font-size:14px; color:var(--text); flex:1; }
  .legend-val { font-family:var(--font-display); font-size:14px; font-weight:700; color:var(--ink); }

  /* ---------- SCENARIO ---------- */
  .scen-tabs { display:inline-flex; gap:4px; margin-bottom:18px; background:#eef2f0; padding:4px; border-radius:14px; }
  .scen-tab { padding:8px 20px; border-radius:11px; border:none; font-family:var(--font-body); font-size:13px; font-weight:600; cursor:pointer; background:transparent; color:var(--muted); transition:.2s; }
  .scen-tab.active { background:#fff; color:var(--green-dk); box-shadow:0 2px 8px rgba(20,59,44,0.08); }
  .scen-table { width:100%; border-collapse:collapse; font-size:13px; }
  .scen-table th { background:var(--green-dk); color:#fff; padding:16px 14px; font-weight:700; font-size:15px; letter-spacing:-.2px; text-align:left; }
  .scen-table th:first-child { border-radius:11px 0 0 0; }
  .scen-table th:last-child { border-radius:0 11px 0 0; }
  .scen-table th:not(:first-child){ text-align:right; }
  .scen-table td { padding:11px 14px; border-bottom:1px solid var(--line); }
  .scen-table td:not(:first-child){ text-align:right; font-family:var(--font-display); font-weight:600; }
  .scen-table tr:nth-child(even) td { background:#f8faf9; }
  .scen-table tr.total td { background:var(--comp-lt); font-weight:800; color:var(--green-dk); border-top:2px solid var(--green); }
  .scen-table tr.highlight-row td { background:#fdf7e6; color:#8a6d12; font-weight:800; }
  .scen-table tr.highlight-row td:first-child { color:#8a6d12; }

  /* ---------- BUTTON & NOTES ---------- */
  .print-btn { text-align:center; margin:6px 0 20px; }
  .print-btn button { background: linear-gradient(135deg, #1a5346, #133b32); color:#fff; border:none; padding:15px 38px; border-radius:14px; font-family:var(--font-display); font-size:15px; font-weight:600; cursor:pointer; display:inline-flex; align-items:center; gap:9px; box-shadow:0 8px 24px rgba(20,59,44,0.28); transition:.18s; }
  .print-btn button:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(20,59,44,0.36); }
  .footer-note { background:#fffdf8; border-radius:16px; padding:18px 22px; font-size:12.5px; color:var(--muted); border:1px solid var(--line); line-height:1.65; }
  .footer-note strong { color:var(--green-dk); }
  .doc-source { text-align:center; margin-top:14px; font-size:11px; color:var(--muted); letter-spacing:.3px; }
  .doc-source strong { color:var(--green-dk); font-weight:700; }

  @media print {
    * { -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; }
    body { background:#fff; }
    .print-btn { display:none !important; }
    .card { box-shadow:none; break-inside:avoid; border:1px solid var(--line); }
    .big-stat, .scen-table, .chart-wrap { break-inside:avoid; }
  }
