/* ÄSK Skilsmässotidslinjen. Ärver temats tokens. */
.tid{
  --t-paper:var(--paper,#F1F3EF); --t-surface:var(--surface,#FBFCFA); --t-raised:var(--raised,#FFF);
  --t-ink:var(--ink,#16201D); --t-body:var(--body,#333F3A); --t-muted:var(--muted,#6E7A74);
  --t-line:var(--line,#D7DDD6); --t-line2:var(--line-strong,#BCC5BC);
  --t-acc:var(--accent,#23605A); --t-acc-ink:var(--accent-ink,#1A4A45); --t-acc-soft:var(--accent-soft,#DCE8E4);
  --t-sig:var(--signal,#8E6912); --t-sig-soft:var(--signal-soft,#F0E7CC); --t-sig-ink:var(--signal-ink,#6E5210);
  --t-mono:var(--mono,"IBM Plex Mono",Consolas,monospace);
  --t-disp:var(--display,"Newsreader",Georgia,serif);
  color:var(--t-body);
}
.tid *{box-sizing:border-box}
.tid fieldset{border:0;margin:0 0 20px;padding:0}
.tid legend{font-family:var(--t-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--t-muted);padding:0 0 12px}
.tid-form{background:var(--t-surface);border:1px solid var(--t-line);border-radius:12px;padding:26px}
.tid-lagen{display:grid;gap:10px}
.tid-radio{display:grid;grid-template-columns:20px 1fr;gap:12px;align-items:start;cursor:pointer;
  border:1px solid var(--t-line);border-radius:8px;padding:13px 15px;background:var(--t-raised);
  transition:border-color .15s,background .15s}
.tid-radio:hover{border-color:var(--t-line2)}
.tid-radio:has(input:checked){border-color:var(--t-acc);background:var(--t-acc-soft)}
.tid-radio input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--t-acc)}
.tid-radio b{display:block;font-size:.95rem;color:var(--t-ink)}
.tid-radio span span{display:block;font-size:.85rem;color:var(--t-muted);line-height:1.45;margin-top:2px}
.tid-falt{display:grid;gap:6px;max-width:22em}
.tid-falt label{font-size:.91rem;font-weight:500;color:var(--t-ink)}
.tid input[type=date],.tid input[type=email]{width:100%;font-family:var(--t-mono);font-size:1rem;
  color:var(--t-ink);background:var(--t-raised);border:1px solid var(--t-line2);border-radius:6px;padding:11px 13px}
.tid input:focus{border-color:var(--t-acc);outline:none;box-shadow:0 0 0 3px var(--t-acc-soft)}
.tid-hjalp{font-size:.83rem;color:var(--t-muted);line-height:1.45}

.tid-resultat{margin-top:26px}
.tid-nyckeltal{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:28px}
.tid-kort{background:var(--t-surface);border:1px solid var(--t-line);border-radius:10px;padding:18px 20px}
.tid-kort.viktig{background:var(--t-sig-soft);border-color:var(--t-sig);border-left-width:3px}
.tid-kort .lab{font-size:.85rem;color:var(--t-muted);font-weight:500}
.tid-kort.viktig .lab{color:var(--t-sig-ink)}
.tid-kort .v{font-family:var(--t-disp);font-size:1.55rem;font-weight:500;color:var(--t-ink);
  line-height:1.15;margin-top:4px;font-variant-numeric:tabular-nums}
.tid-kort .sub{font-size:.85rem;color:var(--t-muted);margin-top:4px;line-height:1.4}

.tid-linje{list-style:none;margin:0;padding:0 0 0 30px;position:relative}
.tid-linje::before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:2px;background:var(--t-line)}
.tid-linje li{position:relative;padding:0 0 24px}
.tid-linje li::before{content:"";position:absolute;left:-30px;top:5px;width:16px;height:16px;
  border-radius:50%;background:var(--t-raised);border:2px solid var(--t-line2)}
.tid-linje li.passerad::before{background:var(--t-line2);border-color:var(--t-line2)}
.tid-linje li.nu::before{background:var(--t-acc);border-color:var(--t-acc);
  box-shadow:0 0 0 4px var(--t-acc-soft)}
.tid-linje li.frist::before{background:var(--t-sig);border-color:var(--t-sig)}
.tid-linje .dat{font-family:var(--t-mono);font-size:.86rem;color:var(--t-muted);letter-spacing:.02em}
.tid-linje .rub{font-size:1.02rem;font-weight:600;color:var(--t-ink);margin:2px 0 3px}
.tid-linje li.frist .rub{color:var(--t-sig-ink)}
.tid-linje .txt{font-size:.92rem;line-height:1.55;max-width:62ch}
.tid-linje .mark{display:inline-block;font-family:var(--t-mono);font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;padding:2px 7px;border-radius:3px;margin-left:8px;vertical-align:2px}
.tid-linje li.nu .mark{background:var(--t-acc-soft);color:var(--t-acc-ink)}
.tid-linje li.frist .mark{background:var(--t-sig-soft);color:var(--t-sig-ink)}

.tid-atgarder{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:18px 0 4px;
  border-top:1px solid var(--t-line)}
.tid-fine{font-size:.83rem;color:var(--t-muted)}
.tid-paminn{background:var(--t-surface);border:1px solid var(--t-line);border-radius:12px;
  padding:24px;margin-top:22px}
.tid-paminn h3{margin:0 0 6px;font-size:1.1rem;color:var(--t-ink)}
.tid-paminn p{font-size:.94rem;line-height:1.55;margin:0 0 16px}
.tid-paminn.tid-av{background:var(--t-paper);border-style:dashed}
.tid-paminn.tid-av p{margin:0;color:var(--t-muted)}
.tid-chk{display:grid;grid-template-columns:20px 1fr;gap:12px;align-items:start;margin:16px 0;
  font-size:.88rem;line-height:1.5;cursor:pointer}
.tid-chk input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--t-acc)}
.tid-kontroll{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.tid-status{font-size:.9rem;margin:12px 0 0;min-height:1.2em}
.tid-status.ok{color:var(--t-acc-ink);font-weight:600}
.tid-status.fel{color:var(--t-sig-ink);font-weight:600}
.tid-frisk{background:var(--t-paper);border:1px solid var(--t-line);border-radius:8px;padding:16px 18px;
  font-size:.88rem;color:var(--t-muted);line-height:1.55;max-width:76ch;margin-top:22px}
.tid-frisk b{color:var(--t-ink)}
@media (max-width:700px){ .tid-form{padding:20px} .tid-linje{padding-left:26px} }
@media (prefers-reduced-motion:reduce){ .tid *{transition:none!important} }