:root {
  --bg:#eef1f4; --panel:#fff; --text:#17212b; --muted:#61707d; --line:#d8dee4;
  --navy:#203f6f; --accent:#0b6477; --accent-d:#094e5c;
  --red:#b42318; --amber:#9a6700; --blue:#2456a6; --green:#1f7a44;
  --kritisch:#b42318; --sehr-hoch:#c0341a; --hoch:#c05621; --mittel:#9a6700;
}
* { box-sizing:border-box; }
body { margin:0; font-family:Inter,Segoe UI,Arial,sans-serif; background:var(--bg); color:var(--text); }
a { color:var(--accent); text-decoration:none; }
a:hover { text-decoration:underline; }

/* topbar */
.topbar { display:flex; align-items:center; justify-content:space-between;
  background:#13242b; color:#fff; padding:12px 22px; }
.topbar .brand { color:#fff; font-weight:800; font-size:18px; }
.topbar .brand span { display:block; font-size:11px; font-weight:500; color:#9fb4bd; letter-spacing:.06em; }
.topbar nav { display:flex; gap:18px; align-items:center; }
.topbar nav a { color:#d8e2e6; font-weight:600; font-size:14px; }
.inline { display:inline; margin:0; }
button.link { background:none; border:none; color:#d8e2e6; cursor:pointer; font:inherit; font-weight:600; }

.wrap { max-width:1500px; margin:0 auto; padding:22px; }

/* flash */
.flash { padding:12px 15px; border-radius:8px; margin:0 0 16px; line-height:1.4; }
.flash-success { background:#e4f5ea; border:1px solid #a9d9bd; color:var(--green); }
.flash-error   { background:#fdeceb; border:1px solid #f0b4ae; color:var(--red); }
.flash-warning { background:#fff5db; border:1px solid #e9ce83; color:#7a5b00; }
.flash-info    { background:#e8f2f4; border:1px solid #b9d4da; color:#155e6b; }

/* panels */
.panel { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:18px; margin:0 0 18px; }
.panel h2 { margin:0 0 12px; font-size:18px; }

/* kpis */
.kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:18px; }
.kpi { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:14px 16px; }
.kpi strong { display:block; font-size:26px; }
.kpi span { color:var(--muted); font-size:13px; }
.kpi.warn strong { color:var(--red); }

/* forms */
label { display:block; font-size:13px; font-weight:600; color:#33424e; margin-bottom:4px; }
input, select, textarea { width:100%; padding:8px 10px; border:1px solid #bec8cf; border-radius:6px;
  font:inherit; background:#fff; }
input.invalid, input.invalid:focus { border-color:var(--red); background:#fff6f5; }
textarea { resize:vertical; }
.stack { display:flex; flex-direction:column; gap:12px; }
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:12px; }

.upload-row { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.filters { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.filters input[type=search] { min-width:280px; flex:1; }
.filters select { width:auto; }

/* buttons */
.btn { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:7px;
  border:1px solid var(--line); background:#f3f6f8; color:#1c2b36; font-weight:650; cursor:pointer; font-size:14px; }
.btn:hover { text-decoration:none; background:#e9eef1; }
.btn.primary { background:var(--accent); border-color:var(--accent); color:#fff; }
.btn.primary:hover { background:var(--accent-d); }
.btn.primary:disabled { background:#9bb4bb; border-color:#9bb4bb; cursor:not-allowed; }
/* Generic disabled state — e.g. the queue send button while the draft still loads. */
.btn:disabled, .btn:disabled:hover { opacity:.55; cursor:not-allowed; filter:grayscale(35%); }
.btn.danger { background:#fdeceb; border-color:#f0b4ae; color:var(--red); }
.btn.danger:hover { background:#f9d9d6; }
.btn.ghost { background:transparent; }
.btn.small { padding:4px 9px; font-size:12.5px; }
.btn.link { background:none; border:none; }

/* table */
.table-actions { display:flex; gap:16px; align-items:center; margin-bottom:8px; }
.table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:8px; background:#fff; }
table.leads { width:100%; border-collapse:collapse; font-size:13.5px; }
table.leads th, table.leads td { border-bottom:1px solid var(--line); padding:8px 10px; text-align:left; vertical-align:middle; }
table.leads th { background:var(--navy); color:#fff; position:sticky; top:0; }
table.leads tr:hover td { background:#f6f9fb; }
.firma { font-weight:700; }
.rowact { display:flex; gap:6px; white-space:nowrap; }
.empty { text-align:center; color:var(--muted); padding:26px; }
.hidden { display:none; }

/* badges */
.badge { display:inline-block; padding:2px 7px; border-radius:999px; font-size:11px; font-weight:800; color:#fff; }
.badge.red { background:var(--red); } .badge.amber { background:var(--amber); } .badge.blue { background:var(--blue); }
.prio-badge { display:inline-block; padding:3px 9px; border-radius:999px; color:#fff; font-weight:800; font-size:11.5px; }
.prio-badge.kritisch, .prio-badge.sehr-hoch { background:var(--kritisch); }
.prio-badge.hoch { background:var(--hoch); }
.prio-badge.mittel { background:var(--mittel); }
.status { font-size:12.5px; color:var(--muted); font-weight:650; }
tr.prio-kritisch td:first-child, tr.prio-sehr-hoch td:first-child { box-shadow:inset 5px 0 0 var(--kritisch); }
tr.prio-hoch td:first-child { box-shadow:inset 5px 0 0 var(--hoch); }
tr.prio-mittel td:first-child { box-shadow:inset 5px 0 0 var(--mittel); }

/* review */
.review-head { display:flex; align-items:center; gap:14px; margin-bottom:14px; flex-wrap:wrap; }
.review-head h1 { margin:0; font-size:24px; }
.review-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:start; }
.iframe-wrap { border:1px solid var(--line); border-radius:8px; overflow:hidden; background:#f3f5f7; height:560px; }
.iframe-wrap iframe { width:100%; height:100%; border:0; }
.preview-block { padding:22px; text-align:center; border:1px dashed #d3b58a; border-radius:8px; background:#fff9ef; }
.preview-notice { color:#7a5b00; margin-bottom:12px; font-weight:600; }
.preview-notice.small { font-size:12.5px; margin-bottom:8px; }
.befund { background:#f6f8fa; border:1px solid var(--line); border-radius:8px; padding:12px; font-size:13.5px; line-height:1.55; white-space:pre-wrap; }
.meta { display:grid; grid-template-columns:auto 1fr; gap:4px 14px; margin-top:12px; font-size:13.5px; }
.meta dt { color:var(--muted); font-weight:700; }
.meta dd { margin:0; }
.draft-toolbar { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.draft-toolbar h2 { margin:0; }
.actions-row { display:flex; gap:10px; }
details.skip { margin-top:14px; border-top:1px solid var(--line); padding-top:10px; }
details.skip summary { cursor:pointer; color:var(--muted); font-weight:650; font-size:13.5px; }
details.skip form { margin-top:10px; }
details.skip select { width:auto; }

/* login */
.login-card { max-width:360px; margin:8vh auto; background:#fff; border:1px solid var(--line);
  border-radius:12px; padding:28px; box-shadow:0 8px 30px rgba(20,40,60,.08); }
.brand-lg { font-size:24px; font-weight:850; margin:0 0 18px; color:var(--navy); }
.brand-lg span { display:block; font-size:13px; font-weight:500; color:var(--muted); }

/* nav CTA */
.nav-cta { background:var(--accent); color:#fff !important; padding:5px 10px; border-radius:6px; }
.nav-cta:hover { background:var(--accent-d); text-decoration:none; }

.queue-cta { display:flex; justify-content:space-between; align-items:center; gap:14px;
  background:linear-gradient(90deg,#e8f2f4,#fff); border-color:#b9d4da; }
.queue-cta strong { font-size:16px; display:block; }

/* queue / Fliessband */
.queue-bar { display:flex; justify-content:space-between; align-items:center; gap:12px;
  background:#fff; border:1px solid var(--line); border-radius:10px; padding:12px 16px; margin-bottom:14px; flex-wrap:wrap; }
.queue-firma { font-size:18px; }
.queue-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
.preview-head { display:flex; justify-content:space-between; align-items:center; }
.preview-head h2 { margin:0 0 8px; }
.iframe-wrap.short { height:420px; }
.befund-toggle { margin-top:12px; }
.befund-toggle summary { cursor:pointer; color:var(--muted); font-weight:650; font-size:13px; }
.befund-toggle .befund { margin-top:8px; }
.queue-actions { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.send-big { background:var(--green); border-color:var(--green); color:#fff; font-size:16px; padding:12px 22px; font-weight:800; }
.send-big:hover { background:#186637; }
.queue-done { text-align:center; padding:40px; }
.queue-done h1 { margin-top:0; }

.muted { color:var(--muted); } .small { font-size:12.5px; }

@media (max-width:960px) {
  .queue-grid { grid-template-columns:1fr; }
}

@media (max-width:960px) {
  .review-grid { grid-template-columns:1fr; }
  .kpis { grid-template-columns:repeat(2,1fr); }
}