* { box-sizing: border-box; }
:root { color-scheme: light; --navy:#10263f; --blue:#1c5d8f; --gold:#b68b46; --bg:#f4f6f8; --line:#d9e0e7; --muted:#657486; --danger:#a83c3c; }
body { margin:0; color:#172330; background:var(--bg); font:15px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:var(--blue); }
button,input,select { font:inherit; }
.login-page { min-height:100vh; display:grid; place-items:center; padding:24px; background:linear-gradient(135deg,#10263f,#244f72); }
.login-card { width:min(420px,100%); padding:34px; background:#fff; border-radius:16px; box-shadow:0 22px 70px #07152566; }
.brand { color:var(--navy); font-weight:800; letter-spacing:.03em; }
.login-card h1 { margin:.25rem 0 .4rem; color:var(--navy); }
.login-card p { color:var(--muted); }
label { display:block; margin:16px 0 6px; font-weight:650; }
input,select { width:100%; padding:10px 12px; border:1px solid #b9c5d0; border-radius:8px; background:#fff; }
button,.button { display:inline-block; border:0; border-radius:8px; padding:10px 15px; color:#fff; background:var(--blue); cursor:pointer; text-decoration:none; font-weight:700; }
button:hover,.button:hover { filter:brightness(1.08); }
.alert { padding:10px 12px; border-radius:8px; background:#fff0f0; color:var(--danger); }
.app-shell { min-height:100vh; display:grid; grid-template-columns:250px 1fr; }
.sidebar { padding:24px 16px; color:#dce9f4; background:var(--navy); }
.sidebar .brand { display:block; margin:0 12px 28px; color:#fff; }
.nav a { display:block; padding:11px 12px; margin:3px 0; border-radius:8px; color:#dce9f4; text-decoration:none; }
.nav a.active,.nav a:hover { background:#ffffff1a; color:#fff; }
.sidebar small { display:block; margin:30px 12px 6px; color:#9eb5c9; text-transform:uppercase; letter-spacing:.08em; }
.main { min-width:0; }
.topbar { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 28px; background:#fff; border-bottom:1px solid var(--line); }
.topbar-user { color:var(--muted); }
.content { max-width:1400px; margin:0 auto; padding:28px; }
.toolbar { display:flex; justify-content:space-between; align-items:end; gap:16px; margin-bottom:22px; }
.toolbar h1 { margin:0; color:var(--navy); }
.filter { width:230px; }
.dashboard-section { margin:22px 0; }
.dashboard-section h2 { margin:0 0 10px; color:var(--navy); }
.summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:0 0 26px; }
.summary-card { min-width:0; padding:15px; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:0 2px 8px #10263f08; }
.summary-label { display:block; color:var(--muted); font-size:.82rem; font-weight:700; }
.summary-value { display:block; margin-top:4px; color:var(--navy); font-size:1.45rem; line-height:1.2; }
.summary-date { font-size:1.08rem; white-space:nowrap; }
.summary-meta { display:block; margin-top:5px; color:var(--muted); font-size:.75rem; }
.card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.card,.empty-state { padding:20px; background:#fff; border:1px solid var(--line); border-radius:12px; }
.card strong { display:block; font-size:1.6rem; color:var(--navy); }
.empty-state { color:var(--muted); }
.table-wrap { overflow:auto; background:#fff; border:1px solid var(--line); border-radius:12px; }
.dashboard-scroll-list { max-height:300px; overflow:auto; }
table { width:100%; border-collapse:collapse; min-width:720px; }
th,td { padding:13px 15px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; }
th { position:sticky; top:0; z-index:2; color:var(--muted); background:#f8fafc; font-size:.86rem; }
.badge { display:inline-block; padding:3px 8px; border-radius:999px; color:#225; background:#e8f1f8; font-size:.82rem; }
.logout { color:#fff; background:transparent; border:1px solid #ffffff66; }
.alert-success { background:#eef8ee; color:#2c6b34; }
.muted { color:var(--muted); }
.linklike { border:0; background:none; color:var(--blue); padding:0; margin-left:6px; font-size:.8rem; cursor:pointer; text-decoration:underline; }
.button-sm { padding:5px 10px; font-size:.82rem; border-radius:7px; margin-top:4px; }
.button-ghost { background:#fff; color:var(--blue); border:1px solid var(--line); }
.button-danger { background:var(--danger); }
.tabbar { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px; }
.tab { padding:8px 14px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--navy); text-decoration:none; font-weight:650; font-size:.9rem; }
.tab.active { background:var(--navy); color:#fff; border-color:var(--navy); }
.tab .badge { margin-left:4px; }
.review-actions { white-space:nowrap; display:flex; gap:6px; align-items:center; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }
.badge-cancelled { background:#f6e0e0; color:#8a2f2f; }
.badge-blocked { background:#e8e8ee; color:#555; }
.badge-confirmed { background:#e3f1e6; color:#2c6b34; }
.badge-test { background:#fff3d6; color:#8a6d1f; }
.badge-danger { background:#c0392b; color:#fff; font-weight:700; }
/* Problem-guest warning */
.warn-banner { display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border-radius:10px; background:#fdeceb; border:1px solid #e6b0aa; color:#922b21; margin-bottom:18px; }
.warn-banner .warn-ico { font-size:22px; line-height:1; }
.warn-banner strong { color:#922b21; }
.warn-row td { background:#fdf3f2 !important; }
.warn-flag { display:inline-block; background:#c0392b; color:#fff; font-weight:700; font-size:.72rem; padding:2px 7px; border-radius:6px; margin-left:6px; white-space:nowrap; }
.row-cancelled td { color:var(--muted); }
.repeat-guest { font-size:.95em; cursor:help; }
.review-cell { white-space:normal; min-width:230px; }
.review-chip { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:5px 0; border-bottom:1px dashed var(--line); }
.review-chip:last-of-type { border-bottom:0; }
.review-source { font-weight:700; color:var(--navy); font-size:.82rem; }
.review-stars { color:var(--gold); letter-spacing:1px; }
.review-text { color:var(--muted); font-size:.82rem; }
.review-status-label { color:var(--muted); font-size:.82rem; font-style:italic; }
.review-pending .review-source::after { content:" · angefragt"; color:var(--muted); font-weight:400; font-style:italic; }
.review-none .review-source::after { content:" · keine"; color:var(--muted); font-weight:400; font-style:italic; }
dialog.modal { width:min(520px,100%); max-height:90vh; overflow:auto; padding:26px; border:0; border-radius:14px; background:#fff; box-shadow:0 24px 70px #07152577; }
dialog.modal::backdrop { background:#0b1a2ccc; }
.modal h2 { margin:0 0 8px; color:var(--navy); }
.modal textarea { width:100%; padding:10px 12px; border:1px solid #b9c5d0; border-radius:8px; font:inherit; resize:vertical; }
.modal-actions { display:flex; gap:10px; align-items:center; margin-top:20px; }
.modal-actions .button-danger { margin-left:auto; }
/* Breites Overlay für eingebettete Werkzeuge (DB-Direktzugriff) */
dialog.modal-wide { width:96vw; max-width:96vw; height:92vh; max-height:92vh; padding:0; overflow:hidden; display:none; }
dialog.modal-wide[open] { display:flex; flex-direction:column; }
.modal-wide-bar { display:flex; align-items:center; gap:14px; padding:10px 16px; background:#b8860b; color:#fff; font-size:.85rem; }
dialog.modal-wide[data-prod="1"] .modal-wide-bar { background:#c0392b; }
.modal-wide-bar strong { white-space:nowrap; letter-spacing:.2px; }
.modal-wide-bar span { flex:1; opacity:.95; }
.modal-wide-bar a { color:#fff; text-decoration:underline; white-space:nowrap; }
.modal-wide-bar .button { padding:5px 14px; background:#ffffff2e; border:1px solid #ffffff8c; color:#fff; }
.modal-wide-frame { flex:1; width:100%; border:0; display:block; background:#fff; }
@media (max-width: 1250px) { .summary-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media (max-width:900px) { .app-shell { grid-template-columns:1fr; } .sidebar { display:none; } .content { padding:18px; } .toolbar { align-items:stretch; flex-direction:column; } .filter { width:100%; } .summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .card-grid { grid-template-columns:1fr; } }