/* ===== Luxus-Design „Noir & Gold“ (html data-theme="noir") ===== */

/* ---------- 1  NOIR & GOLD ---------- */
:root[data-theme="noir"]{
  --bg:#0d0c0a; --surface:#16140f; --line:#2e291f; --fg:#f2ebdc; --muted:#a2977f;
  --accent:#c9a45c; --accent-fg:#16110a; --accent-soft:#2a2316;
  --plan:#b8ad96; --plan-bg:#24211a; --go:#e8c26e; --go-bg:#3a2e14;
  --done:#8fcf9f; --done-bg:#16291c; --danger:#ef8a7c; --danger-bg:#3a1a16;
  --warn:#e8c26e; --warn-bg:#3a2e14; --prob:#ef8a7c; --prob-bg:#3a1a16;
  --f-display:"Cormorant Garamond","Iowan Old Style",Georgia,serif;
  --f-body:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --lux-grad:linear-gradient(135deg,#e7cd8f 0%,#c9a45c 45%,#a27c37 100%);
  --lux-glow:0 18px 40px -22px rgba(201,164,92,.45);
  --lux-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 14px 30px -18px rgba(0,0,0,.8);
  --lux-hair:linear-gradient(90deg,transparent,rgba(201,164,92,.7),transparent);
  color-scheme:dark;
}
/* ---------- Gemeinsame Luxus-Details ---------- */
:root[data-theme] body{letter-spacing:.005em}
:root[data-theme="noir"] body{background:radial-gradient(1200px 600px at 85% -10%,rgba(201,164,92,.10),transparent 60%),var(--bg) fixed}

:root[data-theme] header{background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);border-bottom:0;padding-block:14px}
:root[data-theme] header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--lux-hair)}
:root[data-theme] .brand{text-transform:none;font-weight:600;font-size:1.75rem;letter-spacing:.01em}
:root[data-theme] .brand img{border-radius:50%;width:32px;height:32px}

:root[data-theme] h1,:root[data-theme] h2{text-transform:none;font-weight:600;letter-spacing:.01em}
:root[data-theme] h2{font-size:1.5rem}
:root[data-theme] .daylabel{font-weight:600;font-size:1.75rem}
:root[data-theme] .dayhead{text-transform:none;letter-spacing:.02em;font-size:1.35rem;font-weight:600}
:root[data-theme] .col h3{font-size:1.3rem;font-weight:600}

:root[data-theme] header .tabs{background:transparent;border-color:transparent;gap:2px}
:root[data-theme] header .tabs button{border-radius:99px;padding:8px 16px;letter-spacing:.02em}
:root[data-theme] header .tabs button:hover{color:var(--fg)}
:root[data-theme] header .tabs button[aria-selected="true"]{background:var(--lux-grad);color:var(--accent-fg);box-shadow:var(--lux-glow)}

:root[data-theme] .btn{border-radius:99px;padding:9px 18px;letter-spacing:.02em;transition:transform .15s,box-shadow .2s,border-color .2s}
:root[data-theme] .btn:hover:not(:disabled){border-color:var(--accent)}
:root[data-theme] .btn.primary{background:var(--lux-grad);border:0;box-shadow:var(--lux-glow)}
:root[data-theme] .btn.primary:hover:not(:disabled){transform:translateY(-1px)}
:root[data-theme] .btn.small{padding:5px 12px}
:root[data-theme] input,:root[data-theme] select,:root[data-theme] textarea{border-radius:10px;background:color-mix(in srgb,var(--surface) 60%,var(--bg))}
:root[data-theme] input:focus,:root[data-theme] select:focus,:root[data-theme] textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}

:root[data-theme] .panel,:root[data-theme] .col,:root[data-theme] .kpi,:root[data-theme] .trip,:root[data-theme] .tl-scroll,:root[data-theme] .login form{border-radius:18px;box-shadow:var(--lux-shadow)}
:root[data-theme] .panel{padding:22px}
:root[data-theme] .col{padding:14px}
:root[data-theme] .col.unassigned{box-shadow:none}

/* Kennzahlen: grosse edle Zahlen */
:root[data-theme] .kpis{gap:14px}
:root[data-theme] .kpi{padding:16px 18px;position:relative;overflow:hidden}
:root[data-theme] .kpi::before{content:"";position:absolute;left:18px;right:18px;top:0;height:1px;background:var(--lux-hair)}
:root[data-theme] .kpi .v{font-family:var(--f-display);font-size:2.1rem;font-weight:600;line-height:1.05;font-variant-numeric:lining-nums tabular-nums}
:root[data-theme] .kpi .l{margin-top:6px;letter-spacing:.14em;font-size:.68rem}

/* Auftragskarten */
:root[data-theme] .card{border-radius:14px;padding:12px 14px;background:color-mix(in srgb,var(--surface) 55%,var(--bg));border-left-width:1px;position:relative;overflow:hidden;transition:transform .15s,border-color .2s}
:root[data-theme] .card::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:3px;background:var(--plan)}
:root[data-theme] .card.unterwegs::before{background:var(--go)}
:root[data-theme] .card.erledigt::before{background:var(--done)}
:root[data-theme] .card.problem::before{background:var(--prob)}
:root[data-theme] .card:hover{transform:translateY(-1px);border-color:var(--accent)}
:root[data-theme] .card .t{font-family:var(--f-display);font-size:1.2rem;font-weight:600;color:var(--accent)}
:root[data-theme] .pill{letter-spacing:.04em}

/* Fahrer-App */
:root[data-theme] .trip{border-left-width:1px;padding:18px;position:relative;overflow:hidden}
:root[data-theme] .trip::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:3px;border-radius:3px;background:var(--plan)}
:root[data-theme] .trip.unterwegs::before{background:var(--go)}
:root[data-theme] .trip.erledigt::before{background:var(--done)}
:root[data-theme] .trip .t{font-family:var(--f-display);font-size:2rem;font-weight:600;color:var(--accent);line-height:1}
:root[data-theme] .go{background:var(--lux-grad);border-radius:99px;box-shadow:var(--lux-glow);letter-spacing:.04em;padding:16px}
:root[data-theme] .statusbtns button{border-radius:14px}
:root[data-theme] .leg .dot{border-color:var(--accent)}

/* Tabellen, Listen */
:root[data-theme] .tbl th{letter-spacing:.12em}
:root[data-theme] .bar{background:var(--lux-grad);height:4px}
:root[data-theme] .item{border-radius:14px}
:root[data-theme] .hint,:root[data-theme] .welcome{border-radius:16px;border:1px solid color-mix(in srgb,var(--accent) 30%,transparent)}
:root[data-theme] .toast{border-radius:99px;background:var(--lux-grad);color:var(--accent-fg);box-shadow:var(--lux-glow)}
:root[data-theme] .drawer{box-shadow:-30px 0 60px -30px rgba(0,0,0,.6)}
:root[data-theme] .backdrop{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}

/* Anmeldung */
:root[data-theme] .login{padding-top:10vh}
:root[data-theme] .login h1{font-size:2.6rem}
:root[data-theme] .login .logo{border-radius:50%;box-shadow:0 0 0 1px var(--accent),0 0 0 6px color-mix(in srgb,var(--accent) 15%,transparent),var(--lux-glow)}
:root[data-theme] .login form{padding:24px;gap:14px}
:root[data-theme] .kpi .v{font-size:clamp(1.5rem,2.2vw,2.1rem)}
:root[data-theme] .tag{border-radius:99px;padding:2px 9px}
:root[data-theme="noir"] .tag.cold{background:#13303f;color:#9fd8f5}
:root[data-theme="noir"] .tag.adr{background:#3b2410;color:#ffb98a}
:root[data-theme="noir"] .tag.lift{background:#2a2140;color:#cdb6ff}
:root[data-theme="noir"] .tag.frag{background:#3a1626;color:#ffa8cc}
:root[data-theme] body{font-variant-numeric:lining-nums}
:root[data-theme] h1,:root[data-theme] h2,:root[data-theme] .daylabel,:root[data-theme] .card .t,:root[data-theme] .trip .t,:root[data-theme] .kpi .v,:root[data-theme] .brand{font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1}
@media print{:root[data-theme] body{background:#fff!important;color:#000}:root[data-theme] header::after{display:none}}
:root[data-theme] input[type=checkbox],:root[data-theme] input[type=radio]{accent-color:var(--accent)}
:root[data-theme] ::selection{background:color-mix(in srgb,var(--accent) 40%,transparent)}
:root[data-theme] .tbl tr.dayrow td{font-family:var(--f-display);text-transform:none;letter-spacing:.02em;font-size:1.05rem;font-weight:600;background:transparent}
:root[data-theme] .seg.ranges{border-radius:99px}
:root[data-theme] .seg.ranges button[aria-pressed="true"]{background:var(--lux-grad);color:var(--accent-fg)}
:root[data-theme] .sn-nav button[aria-current="page"]{background:var(--lux-grad);color:var(--accent-fg);border-color:transparent}
:root[data-theme] .menubtn{border-radius:99px}
