/* ABS Rollen und Rechte – Oberfläche. ABS-Blau R27 G69 B137, ABS-Gold R225 G175 B70 */
:root { --abs-blau: #1b4589; --abs-blau-d: #143567; --abs-gold: #e1af46; --abs-gold-h: #fbf1dc; --abs-gold-ink: #2a1f05; }

/* Kopfleiste */
#appView .top { background: var(--abs-blau); color: #fff; border-bottom: 3px solid var(--abs-gold); height: auto; min-height: 64px; flex-wrap: wrap; gap: 8px; padding-top: 8px; padding-bottom: 8px; }
#appView .top .brand { color: #fff; }
#appView .top .brand small { color: rgba(255, 255, 255, .75); }
#sessionUser.muted { color: #fff; }
.rl-wer { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; }
.rl-wer b { font-size: 15px; }
.rl-badge { background: var(--abs-gold); color: var(--abs-gold-ink); font-weight: 700; font-size: 12px; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.rl-ktw { background: rgba(255, 255, 255, .16); border-radius: 999px; padding: 3px 10px; font-size: 13px; white-space: nowrap; }
.rl-kopfknopf { background: transparent; border: 1px solid rgba(255, 255, 255, .55); color: #fff; padding: 6px 11px; border-radius: 8px; font-size: 13px; }
.rl-kopfknopf:hover { background: rgba(255, 255, 255, .12); }

/* Anmeldung */
#loginView { background: var(--abs-blau); color: #fff; border: 0; }
#loginView .title { color: #fff; }
#loginView .sub { color: rgba(255, 255, 255, .75); }
#loginView .field label { color: #fff; }
#loginView button.accent { background: var(--abs-gold); color: var(--abs-gold-ink); font-weight: 700; width: 100%; padding: 13px; }
#loginView #loginMsg { color: #ffd9d9; font-size: 14px; }

/* Navigation: aktiver Punkt mit Gold-Kante */
.navbtn.active { box-shadow: inset 4px 0 0 var(--abs-gold); }

/* Ohne Recht "Patientensuche" kein Anruf-Popup */
body.rl-ohne-patient #ringcentralIncomingCall { display: none !important; }

/* Besatzung auf den Fahrzeugkarten */
.rl-crew { margin-top: 10px; border-top: 1px solid var(--line, #dfe3e8); padding-top: 8px; font-size: 14px; }
.rl-crew-zeile { display: flex; justify-content: space-between; gap: 8px; padding: 2px 0; }
.rl-crew-pos { color: var(--muted, #6b7280); font-size: 12px; white-space: nowrap; }
.rl-crew-leer { color: var(--muted, #6b7280); font-style: italic; }
.rl-hinweis { margin-top: 8px; background: var(--abs-gold-h); border-left: 4px solid var(--abs-gold); padding: 7px 9px; border-radius: 6px; font-size: 13px; color: #5a4310; }

/* Dialog */
.rl-overlay { position: fixed; inset: 0; background: rgba(15, 25, 45, .55); z-index: 2000; display: flex; align-items: flex-start; justify-content: center; padding: 6vh 16px 16px; overflow-y: auto; }
.rl-dialog { background: #fff; color: #17202a; border-radius: 16px; width: min(460px, 100%); padding: 20px; box-shadow: 0 20px 50px rgba(0, 0, 0, .3); }
.rl-dialog.breit { width: min(640px, 100%); }
.rl-dialog h2 { margin: 0 0 4px; font-size: 21px; color: var(--abs-blau-d); }
.rl-dialog .rl-klein { color: #6b7280; font-size: 14px; margin: 0 0 14px; }
.rl-fz { display: block; width: 100%; text-align: left; background: #fff; color: #17202a; border: 2px solid #dfe3e8; border-radius: 12px; padding: 11px 14px; margin-bottom: 9px; }
.rl-fz.on { border-color: var(--abs-gold); background: var(--abs-gold-h); }
.rl-fz b { font-size: 18px; color: var(--abs-blau); }
.rl-fz .rl-info { font-size: 13px; color: #6b7280; margin-top: 2px; }
.rl-seg { display: flex; background: #f3f5f9; border-radius: 10px; padding: 4px; margin: 12px 0; }
.rl-seg button { flex: 1; background: transparent; color: #17202a; padding: 10px; border-radius: 7px; }
.rl-seg button.on { background: var(--abs-blau); color: #fff; font-weight: 600; }
.rl-gross { width: 100%; background: var(--abs-blau); color: #fff; padding: 14px; border-radius: 12px; font-size: 16px; font-weight: 600; }
.rl-gross.gold { background: var(--abs-gold); color: var(--abs-gold-ink); }
.rl-leise { width: 100%; background: transparent; color: var(--abs-blau); margin-top: 8px; }
.rl-fein { text-align: center; font-size: 12px; color: #6b7280; margin-top: 10px; }
.rl-meldung { margin: 10px 0; padding: 9px 11px; border-radius: 8px; font-size: 14px; }
.rl-meldung.fehler { background: #fff0f0; color: #9b1c1c; }
.rl-meldung.frage { background: var(--abs-gold-h); color: #5a4310; }
.rl-meldung.ok { background: #e8f6ef; color: #0b7a43; }

/* Formulare und Tabellen */
.rl-feld { display: flex; flex-direction: column; gap: 5px; margin: 10px 0; }
.rl-feld label { font-size: 13px; font-weight: 650; color: #374151; }
.rl-feld input { padding: 10px 12px; border: 1px solid #cfd5dc; border-radius: 9px; }
.rl-rollen { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.rl-rollen label { display: flex; gap: 8px; align-items: center; font-size: 14px; font-weight: 400; background: #f6f8fb; padding: 8px; border-radius: 8px; }
.rl-tabelle { width: 100%; border-collapse: collapse; background: #fff; }
.rl-tabelle th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: #6b7280; padding: 9px 10px; background: #f3f5f9; }
.rl-tabelle td { padding: 9px 10px; border-top: 1px solid #e5e8ee; font-size: 14px; vertical-align: top; }
.rl-tabelle tr.aus td { color: #a0a8b5; }
.rl-rolle { display: inline-block; background: #e6ecf6; color: var(--abs-blau); font-size: 12px; font-weight: 600; padding: 2px 8px; border-radius: 999px; margin: 0 4px 3px 0; }
.rl-rolle.admin { background: var(--abs-gold); color: var(--abs-gold-ink); }
.rl-knopf { background: var(--abs-blau); color: #fff; padding: 8px 13px; border-radius: 9px; font-size: 14px; }
.rl-knopf.hell { background: #eef1f4; color: #111827; }
.rl-tabellen-rahmen { overflow-x: auto; border: 1px solid #e5e8ee; border-radius: 12px; }
@media (max-width: 700px) { .rl-rollen { grid-template-columns: 1fr; } }

/* Menü links in ABS-Farben, Abmelden nur noch oben rechts */
#appView .side { background: var(--abs-blau-d); }
#appView .side .navbtn { color: rgba(255, 255, 255, .88); border-radius: 10px; }
#appView .side .navbtn:hover { background: rgba(255, 255, 255, .10); color: #fff; }
#appView .side .navbtn.active { background: rgba(255, 255, 255, .16); color: #fff; font-weight: 650; box-shadow: inset 4px 0 0 var(--abs-gold); }
#appView .side .navbtn[onclick*="logout"] { display: none !important; }

/* Einstellungen in ABS-Farben */
#page-settings .settings-nav.active { background: #e8eef8; color: var(--abs-blau); box-shadow: inset 4px 0 0 var(--abs-gold); }
#page-settings button.accent, #page-settings .settings-page button:not(.secondary):not(.settings-nav):not(.settings-integration-card):not(.rl-knopf.hell) { background: var(--abs-blau); color: #fff; }
#page-settings .settings-page button.secondary { background: #eef1f4; color: #111827; }
.rl-rechte-info { margin-top: 14px; }
.rl-rechte-info summary { cursor: pointer; color: var(--abs-blau); font-weight: 600; }
.rl-rechte-info table { margin-top: 8px; }

/* Auswahl Disposition */
.rl-fz.rl-fz-dispo { border-style: dashed; }

/* Fahrten */
.rl-fahrten-kopf .row { gap: 8px; }
.rl-trenner { width: 1px; height: 26px; background: #dfe3e8; margin: 0 4px; }
.rl-suche { flex: 1; min-width: 220px; padding: 9px 12px; border: 1px solid #cfd5dc; border-radius: 9px; }
.rl-fahrten-kopf input[type=date] { padding: 8px; border: 1px solid #cfd5dc; border-radius: 8px; }
.rl-fahrten tr.rl-zeile { cursor: pointer; }
.rl-fahrten tr.rl-zeile:hover td { background: #f6f8fb; }
.rl-zeit { display: inline-block; white-space: nowrap; font-size: 12px; background: #eef2f7; border-radius: 6px; padding: 2px 6px; margin: 0 4px 3px 0; }
.rl-status { display: inline-block; white-space: nowrap; font-size: 12px; font-weight: 600; border-radius: 999px; padding: 3px 9px; }
.rl-st-plan { background: #eef2f7; color: #374151; }
.rl-st-lauf { background: var(--abs-gold-h); color: #5a4310; }
.rl-st-fertig { background: #e8f6ef; color: #0b7a43; }
.rl-st-storno { background: #fff0f0; color: #9b1c1c; }
.rl-detail td { background: #fafbfd; }
.rl-detail-gitter { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px 14px; }
.rl-detail-gitter div { display: flex; flex-direction: column; font-size: 13px; border-bottom: 1px dashed #e5e8ee; padding: 3px 0; }
.rl-detail-gitter span { color: #6b7280; font-size: 11px; }
.rl-detail-gitter b { font-weight: 600; word-break: break-word; }

/* Mitarbeiter aus DISPOLIVE (2026-10-27) */
.rl-quali{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;background:rgba(225,175,70,.18);color:#7a5a12;font-size:12px;font-weight:600;vertical-align:middle}
.rl-warn{color:#a4400b;font-weight:600}
.rl-ein-liste{max-height:50vh;overflow:auto}
.rl-crew-zeile > span:first-child{min-width:0}
.rl-crew-zeile > button{flex:none;align-self:center}

/* Besatzung auf den Fahrzeugkarten (2026-10-27, ueberarbeitet) */
.rl-crew.rl-crew-karte{margin-top:auto;border-top:1px solid var(--line,#dfe3e8);padding-top:12px;display:flex;flex-direction:column;gap:6px}
.rl-crew-titel{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#6b7280);margin-bottom:2px}
.rl-person{display:grid;grid-template-columns:78px minmax(0,1fr) auto;align-items:start;gap:10px;padding:8px 10px;border-radius:10px;background:#f4f6fa}
.rl-person-pos{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#1b4589;padding-top:3px}
.rl-person-text{display:flex;flex-direction:column;min-width:0}
.rl-person-name{font-size:15px;font-weight:650;color:#111827;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rl-person-quali{font-size:12px;color:var(--muted,#6b7280);margin-top:1px}
.rl-person-warn{font-size:12px;font-weight:600;color:#9a6a06;margin-top:3px}
.rl-person-zeit{font-size:12px;color:var(--muted,#6b7280);white-space:nowrap;padding-top:3px}
.rl-person.leer{background:transparent;border:1px dashed #d5dbe3}
.rl-person.leer .rl-person-name{font-weight:500;font-style:italic;color:#9aa3af}
.rl-person.leer .rl-person-pos{color:#9aa3af}
.rl-crew-hinweis{font-size:12px;color:#9a6a06;font-weight:600;padding:2px 2px 0}

/* ABS-DIENSTPLAN-V1.2: Besatzungstafel (Plan · Anmeldung · ZEP) */
.rl-tafel-leiste{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.rl-tafel{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:14px;align-items:start}
.rl-tkarte{padding:14px 16px}
.rl-tkopf{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.rl-tkopf b{font-size:18px;color:var(--abs-blau)}
.rl-tz{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line,#e3e8ef);font-size:14px}
.rl-tz.ohne{background:#fffaf3;margin:0 -16px;padding:10px 16px}
.rl-tz-pos{color:var(--muted,#6b7280);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:1px}
.rl-tz-wer{min-width:0}
.rl-tz-name{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.rl-tz-name b{font-size:15px}.rl-tz-name .rl-quali{margin-left:0}
.rl-tz-info{margin-top:3px;font-size:13px;color:#374151;font-variant-numeric:tabular-nums;line-height:1.5}
.rl-sep{color:#c3cad5}
.rl-tz-st{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.rl-tk{padding:5px 10px;font-size:13px}
.rl-mut{color:var(--muted,#6b7280);font-size:12px}
.rl-spaet{color:#b91c1c;font-weight:600;font-size:12px}
.rl-sw{display:inline-block;min-width:20px;text-align:center;padding:0 4px;border-radius:4px;font-weight:800;font-size:11px}
.rl-tchip{display:inline-block;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;white-space:nowrap}
.rl-tchip.ok{background:#e9f6ee;color:#166534}.rl-tchip.info{background:#e8eef8;color:var(--abs-blau)}
.rl-tchip.warn{background:var(--abs-gold-h);color:#8a6408}.rl-tchip.bad{background:#fdecec;color:#b91c1c}.rl-tchip.grau{background:#eef1f4;color:#4b5563}
@media (max-width:700px){.rl-tafel{grid-template-columns:1fr}}
.rl-tz-info span{white-space:nowrap}
