/* PlanPunch – Erscheinungsbild "Burger King": Farben und Formen angelehnt an die BK-Markenwelt (Braun, Flammen-Orange, Rot, Creme, rund).
   Kein BK-Logo, keine BK-Hausschrift. Wird über Einstellungen → Erscheinungsbild geschaltet; Aufbau und Bedienung bleiben gleich. */
@font-face { font-family: "Fredoka"; font-weight: 500; font-display: swap; src: url("/vendor/fonts/fredoka-latin-500-normal.woff2") format("woff2"); }
@font-face { font-family: "Fredoka"; font-weight: 600; font-display: swap; src: url("/vendor/fonts/fredoka-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Fredoka"; font-weight: 700; font-display: swap; src: url("/vendor/fonts/fredoka-latin-700-normal.woff2") format("woff2"); }

:root {
  --ink: #502314; --muted: #8B6B58; --line: #DCCDBB; --line2: #EEE3D4; --bg: #F5EBDC; --bg2: #F5EBDC;
  --accent: #FF8732; --accent-soft: #FFE6D1; --accent-ink: #502314;
  --ok: #198737; --warn: #B85C00; --bad: #D62300; --info: #1F5FA8;
  --ok-soft: #DDF0E2; --warn-soft: #FFE6D1; --bad-soft: #FBDAD3; --info-soft: #DDE8F6;
  --radius: 999px; --display: "Fredoka", "Barlow", sans-serif;
}
html, body { background: #F5EBDC !important; color: var(--ink); }
h1, h2, h3, .logo, .kpi .v { font-family: var(--display); letter-spacing: -.01em; }
h1 { font-weight: 700; } h2 { font-weight: 600; } h3 { font-weight: 600; }
h4 { border-bottom-color: var(--line); }
.logo b { font-weight: 700; color: var(--bad); }

.btn { border-radius: 999px; border-color: var(--ink); }
.btn.primary { background: var(--bad); border-color: var(--bad); color: #fff; }
.btn.primary:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.btn.sm { padding: .28rem .8rem; }
.input, select.input, textarea.input { border-radius: 12px; border-color: #B9A690; }
.input:focus { border-color: var(--ink); }
.card { border: 1px solid var(--line); border-top: 1px solid var(--line); border-radius: 16px; }
.badge { border-radius: 999px; padding: .08rem .6rem; }
.badge.gelb { background: #FFAA00; color: #502314; }
.chip { border-radius: 999px; } .chip.on { background: var(--ink); }
.dot { border-radius: 50%; }
.bar { border-radius: 999px; } .bar i { background: var(--bad); border-radius: 999px; }
.pill { border-radius: 999px; }
table.t th { border-bottom-color: var(--ink); }
table.t tbody tr:hover td { background: #FFF4EA; }
.toast { background: var(--ink); border-left: none; border-radius: 999px; padding: .75rem 1.4rem; }
.toast.bad { background: var(--bad); }
.modal { border-top: none; border-radius: 22px; }
hr { border-top-color: var(--line); }

/* Anzeigetafel: braunes Brett statt schwarzer Tafel */
.kpi { background: var(--ink); border-top: none; border-radius: 18px; overflow: hidden; --bad: #FF9A85; --warn: #FFAA00; --ok: #7BDB9A; }
.kpi .card { border-radius: 0; border: none; border-left: 1px solid #6E3A28; }
.kpi .card:first-child { border-left: none; }
.kpi .l { color: #E8D5C2; }

/* Manager */
aside.nav { border-right: 1px solid var(--line); }
aside select.input { border-color: var(--ink); }
aside .nav-group { border-top-color: var(--line2); }
aside button.nav-item { border-radius: 0 999px 999px 0; width: calc(100% - 12px); }
aside button.nav-item:hover { background: #FBF3E8; }
aside button.nav-item.on { background: var(--accent); border-left-color: var(--bad); }
aside button.nav-item .n { background: var(--bad); border-radius: 999px; }
aside .foot { border-top: 1px solid var(--line); }
.bell .n { border-radius: 999px; }
.login { border-radius: 22px !important; border-top: 10px solid var(--accent) !important; }
.plan { border: 2px solid var(--ink); border-radius: 16px; }
.plan tbody tr:nth-child(even) td { background: #FBF6EF; }
.plan td.day.heute { background: #FFF1E4; }
.plan td.day:empty::after { color: var(--line); }
.shift { border-radius: 6px; }
.abw { border-radius: 6px; }
.daytl { border-radius: 8px; } .daytl .blk { border-radius: 5px; }
.cov div { background: #B9A690; border-radius: 2px 2px 0 0; }
.cal { border-top-color: var(--ink); }
.demand input { border-radius: 6px; }
.live .p { border-bottom-color: var(--line2); }

/* Terminal und App: brauner Kopf mit Flammen-Kante */
header { background: var(--ink) !important; border-bottom-color: var(--accent) !important; }
header .clock { color: #FFAA00 !important; }
header .logo b { color: var(--accent); }
.wrap { border-radius: 20px; overflow: hidden; }
.pad { border-radius: 14px; overflow: hidden; border: 2px solid var(--ink) !important; }
.pad button { border-right: 1px solid var(--line) !important; border-bottom: 1px solid var(--line) !important; font-family: var(--display) !important; }
.pinbox span { border-radius: 50%; }
.panel { border-radius: 22px; }
.actions button { border-radius: 999px !important; font-family: var(--display) !important; }
.big, .half h2, .panel h2 { font-family: var(--display) !important; }
.scan { border-radius: 14px; } .scan .frame { border-radius: 14px; }
nav { border-top: 1px solid var(--line) !important; }
nav button.on { background: var(--accent-soft) !important; border-top-color: var(--bad) !important; }
nav button .n { border-radius: 999px; }
.state { border-radius: 16px; font-family: var(--display) !important; }
.pbtn { border-radius: 999px !important; font-family: var(--display) !important; }
.seg { border-radius: 999px; overflow: hidden; }
.day.today .d { border-radius: 10px; }