@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Sans:wght@300;400;500;600;700;800&display=swap');
/* ═══════════════════════════════════════════════════════════
   BASE
═══════════════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg: #0e0f13; --surface: #16181f; --surface2: #1e2028;
  --border: #252830; --accent: #c9a96e; --accent2: #6e9ec9;
  --text: #e8e6e0; --text2: #6b6d78; --text3: #4a5060;
  --green: #4caf88; --yellow: #eab308; --blue: #6e9ec9;
  --gray: #6b7280; --red: #e06b6b; --orange: #f97316;
  --radius: 8px; --font: 'DM Sans', sans-serif;
  /* Status-Balken Dark */
  --s-confirmed-bg: #1a2e1a; --s-confirmed-fg: #86efac; --s-confirmed-br: #4caf8866;
  --s-pending-bg:   #2e2a1a; --s-pending-fg:   #fde68a; --s-pending-br:   #eab30866;
  --s-checkin-bg:   #1a2535; --s-checkin-fg:   #93c5fd; --s-checkin-br:   #6e9ec966;
  --s-checkout-bg:  #1e2028; --s-checkout-fg:  #9ca3af; --s-checkout-br:  #6b728066;
  --s-cancelled-bg: #2e1a1a; --s-cancelled-fg: #fca5a5; --s-cancelled-br: #e06b6b66;
  /* Tooltip Dark */
  --tooltip-bg: #0a0c10;
  /* Weekend / hover overlays */
  --weekend-overlay: rgba(255,255,255,.025);
  --row-hover: rgba(255,255,255,.02);
  --today-overlay: rgba(201,169,110,.12);
  --today-overlay2: rgba(201,169,110,.08);
  --slot-hover: rgba(201,169,110,.08);
  --loading-overlay: rgba(14,15,19,.7);
}

/* ═══════════ LIGHT MODE ═══════════ */
:root[data-theme="light"] {
  --bg:       #f5f3ef;
  --surface:  #ffffff;
  --surface2: #f0ede8;
  --border:   #d4cfc5;
  --accent:   #a07d3f;
  --accent2:  #4a7cb5;
  --text:     #1e1c18;
  --text2:    #6b6560;
  --text3:    #a09888;
  --green:    #3a9470;
  --yellow:   #b8900a;
  --blue:     #4a7cb5;
  --gray:     #64748b;
  --red:      #c85050;
  --orange:   #d4650f;
  /* Status-Balken Light */
  --s-confirmed-bg: #e8f5e9; --s-confirmed-fg: #1b5e20; --s-confirmed-br: #3a9470;
  --s-pending-bg:   #fff8e1; --s-pending-fg:   #5d4037; --s-pending-br:   #b8900a;
  --s-checkin-bg:   #e3f2fd; --s-checkin-fg:   #1a3a5c; --s-checkin-br:   #4a7cb5;
  --s-checkout-bg:  #f0ede8; --s-checkout-fg:  #5d5550; --s-checkout-br:  #a09888;
  --s-cancelled-bg: #fce4ec; --s-cancelled-fg: #5d1a1a; --s-cancelled-br: #c85050;
  /* Tooltip Light */
  --tooltip-bg: #1e1c18;
  /* Overlays für Light Mode */
  --weekend-overlay: rgba(0,0,0,.03);
  --row-hover: rgba(0,0,0,.02);
  --today-overlay: rgba(160,125,63,.1);
  --today-overlay2: rgba(160,125,63,.06);
  --slot-hover: rgba(160,125,63,.07);
  --loading-overlay: rgba(245,243,239,.8);
}
body { font-family: var(--font); background: var(--bg); color: var(--text);
  height: 100vh; display: flex; flex-direction: column; overflow: hidden; }

/* ═══════════════════════════════════════════════════════════
   LOGIN
═══════════════════════════════════════════════════════════ */
#loginScreen { display: flex; align-items: center; justify-content: center;
  height: 100vh; background: var(--bg); }
.login-box { background: var(--surface); border: 1px solid var(--border);
  border-radius: 16px; padding: 40px; width: 360px; text-align: center; }
.login-box h1 { font-family: 'DM Serif Display', serif; font-size: 28px; margin-bottom: 8px; color: var(--accent); letter-spacing: .03em; }
.login-box h1 span { color: var(--text); }
.login-box p { color: var(--text2); margin-bottom: 32px; font-size: 14px; }
.login-logo { margin-bottom: 20px; }
.login-logo img { max-width: 280px; max-height: 120px; object-fit: contain; }
.field-wrap { position: relative; margin-bottom: 16px; text-align: left; }
.field-wrap label { display: block; font-size: 12px; color: var(--text2);
  margin-bottom: 6px; font-weight: 500; }
.field-wrap input { width: 100%; background: var(--surface2); border: 1px solid var(--border);
  border-radius: var(--radius); padding: 10px 40px 10px 12px; color: var(--text);
  font-size: 14px; outline: none; transition: border-color .2s; }
.field-wrap input:focus { border-color: var(--accent); }
.eye-btn { position: absolute; right: 10px; bottom: 10px; background: none;
  border: none; color: var(--text2); cursor: pointer; padding: 2px; font-size: 16px; }
.btn-primary { width: 100%; background: var(--accent); border: none;
  border-radius: var(--radius); padding: 12px; color: #000;
  font-size: 14px; font-weight: 600; cursor: pointer; transition: opacity .2s; }
.btn-primary:hover { opacity: .85; }
.btn-primary:disabled { opacity: .4; cursor: not-allowed; }
#loginError { color: var(--red); font-size: 13px; margin-top: 12px; display: none; }

/* ═══════════════════════════════════════════════════════════
   TOPBAR
═══════════════════════════════════════════════════════════ */
#app { display: none; flex-direction: column; height: 100vh; overflow: hidden; }
/* Anti-Flicker: Gesamte Tab-Leiste unsichtbar bis Permissions.applyUI() */
#app .tab-scroll-wrap { opacity: 0; }
#app.permissions-ready .tab-scroll-wrap { opacity: 1; transition: opacity .15s ease; }
.topbar { background: var(--surface); border-bottom: 1px solid var(--border);
  padding: 0 20px; display: flex; align-items: center; gap: 12px;
  height: 52px; flex-shrink: 0; }
.topbar h1 { font-family: 'DM Serif Display', serif; font-size: 16px; font-weight: 700; color: var(--accent);
  white-space: nowrap; margin-right: 8px; }
.tab-btn { background: none; border: none; color: var(--text2); padding: 6px 10px;
  border-radius: 6px; cursor: pointer; font-size: 13px; font-weight: 500;
  transition: all .2s; white-space: nowrap; }
.tab-btn:hover { background: var(--surface2); color: var(--text); }
.tab-btn.active { background: var(--accent); color: #000; }
.tab-scroll-wrap .kbd { display:none; }
.tab-scroll-wrap { display:flex; align-items:center; gap:2px; overflow-x:auto; overflow-y:hidden;
  flex:1; min-width:0; scrollbar-width:thin; scrollbar-color: var(--border) transparent; }
.tab-scroll-wrap::-webkit-scrollbar { height:3px; }
.tab-scroll-wrap::-webkit-scrollbar-thumb { background:var(--border); border-radius:2px; }
.tab-scroll-wrap::-webkit-scrollbar-track { background:transparent; }
.topbar-right { margin-left: auto; display: flex; align-items: center; gap: 6px; flex-shrink:0; }
.date-display { font-size: 12px; color: var(--text2); white-space: nowrap; }
.icon-btn { background: var(--surface2); border: 1px solid var(--border);
  border-radius: 6px; padding: 5px 10px; color: var(--text2); cursor: pointer;
  font-size: 12px; transition: all .2s; white-space: nowrap; }
.icon-btn:hover { background: var(--border); color: var(--text); }

/* ═══════════════════════════════════════════════════════════
   TOOLBAR
═══════════════════════════════════════════════════════════ */
.toolbar { background: var(--surface2); border-bottom: 1px solid var(--border);
  padding: 8px 20px; display: flex; align-items: center; gap: 10px;
  flex-shrink: 0; flex-wrap: wrap; }
.toolbar-btn { background: var(--surface); border: 1px solid var(--border);
  border-radius: 6px; padding: 5px 12px; color: var(--text2); cursor: pointer;
  font-size: 12px; transition: all .2s; display: flex; align-items: center; gap: 5px; }
.toolbar-btn:hover { background: var(--border); color: var(--text); }
.toolbar-btn.active { background: var(--accent); border-color: var(--accent); color: #000; }
.toolbar-sep { width: 1px; height: 20px; background: var(--border); margin: 0 2px; }
.toolbar-date { background: var(--surface); border: 1px solid var(--border); border-radius: 6px;
  padding: 4px 8px; font-size: 12px; color: var(--text); font-family: inherit; cursor: pointer; }
.toolbar-date:hover { border-color: var(--accent); }
.toolbar-date:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px rgba(166,138,86,.25); }
.zoom-wrap { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text2); }
#zoomSlider { width: 80px; accent-color: var(--accent); }
.restaurant-select { background: var(--surface); border: 1px solid var(--border);
  border-radius: 6px; padding: 5px 10px; color: var(--text); font-size: 12px;
  cursor: pointer; outline: none; }
.restaurant-select:focus { border-color: var(--accent); }

/* ═══════════════════════════════════════════════════════════
   CONTENT AREAS
═══════════════════════════════════════════════════════════ */
.content { flex: 1; overflow: hidden; display: flex; flex-direction: column; }
.tab-panel { display: none; flex: 1; overflow: hidden; flex-direction: column; }
.tab-panel.active { display: flex; }

/* ═══════════════════════════════════════════════════════════
   HOTEL GANTT (bestehend)
═══════════════════════════════════════════════════════════ */
.gantt-wrap { flex: 1; overflow: auto; position: relative; }
.gantt-grid { display: flex; flex-direction: column; min-width: max-content; }
.gantt-header-row { display: flex; position: sticky; top: 0; z-index: 10;
  background: var(--surface); border-bottom: 2px solid var(--border); }
.gantt-sidebar-cell { width: 160px; min-width: 160px; flex-shrink: 0;
  padding: 8px 12px; font-size: 11px; font-weight: 600; color: var(--text2);
  border-right: 2px solid var(--border); display: flex; align-items: center; }
.gantt-month-row { display: flex; border-bottom: 1px solid var(--border); }
.gantt-month-label { font-size: 11px; font-weight: 700; color: var(--text2);
  padding: 4px 0; text-align: center; border-right: 1px solid var(--border2, #1e2235); }
.gantt-day-headers { display: flex; }
.gantt-day-cell { display: flex; flex-direction: column; align-items: center;
  justify-content: center; border-right: 1px solid var(--border);
  font-size: 10px; flex-shrink: 0; }
.gantt-day-cell.weekend { background: var(--weekend-overlay); }
.gantt-day-cell.today { background: var(--today-overlay); }
.gantt-day-name { color: var(--text2); font-size: 9px; }
.gantt-day-num { font-weight: 700; font-size: 12px; }
.gantt-row { display: flex; border-bottom: 1px solid var(--border); position: relative; }
.gantt-row:hover { background: var(--row-hover); }
.gantt-label { width: 160px; min-width: 160px; flex-shrink: 0; padding: 0 12px;
  font-size: 12px; border-right: 2px solid var(--border); display: flex;
  align-items: center; gap: 8px; height: 40px; }
.gantt-label .room-num { font-weight: 700; color: var(--accent); font-size: 13px; }
.gantt-label .room-name { color: var(--text2); font-size: 11px; }
.floor-header { background: var(--surface2); height: 28px; padding: 0 12px;
  font-size: 11px; font-weight: 700; color: var(--text2); letter-spacing: .5px; }
/* Property-Header (Haus-Gruppe) */
.property-header { background: var(--surface2); border-bottom: 2px solid var(--border);
  display: flex; cursor: pointer; user-select: none; position: relative; }
.property-header:hover { background: var(--slot-hover); }
.property-label { width: 160px; min-width: 160px; flex-shrink: 0;
  padding: 0 10px; border-right: 2px solid var(--border);
  display: flex; align-items: center; gap: 6px; height: 34px; }
.property-label .ph-arrow { font-size: 10px; color: var(--accent); transition: transform .2s; }
.property-label .ph-arrow.open { transform: rotate(90deg); }
.property-label .ph-name { font-weight: 700; font-size: 12px; color: var(--text1); }
.property-label .ph-count { font-size: 10px; color: var(--text3);
  background: var(--surface); padding: 1px 5px; border-radius: 3px; }
/* Verfügbarkeits-Zahlen in der Haus-Kopfzeile */
.avail-cells { display: flex; flex: 1; height: 34px; }
.avail-cell { flex-shrink: 0; border-right: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 700; }
.avail-cell.full  { color: var(--red); }
.avail-cell.low   { color: var(--yellow); }
.avail-cell.ok    { color: var(--green); }
.avail-cell.we    { background: var(--weekend-overlay); }
.gantt-cells { display: flex; position: relative; flex: 1; height: 40px; }
.gantt-cell { border-right: 1px solid var(--border); flex-shrink: 0;
  height: 100%; }
.gantt-cell.weekend { background: var(--weekend-overlay); }
.gantt-cell.today { background: var(--slot-hover); }
.res-bar { position: absolute; top: 4px; height: 32px; border-radius: 5px;
  cursor: pointer; overflow: hidden; display: flex; align-items: center;
  padding: 0 8px; font-size: 11px; font-weight: 600; white-space: nowrap;
  transition: filter .15s; user-select: none; z-index: 2; }
.res-bar:hover { filter: brightness(1.15); z-index: 5; }
.res-bar.dragging  { opacity: .75; z-index: 100; }
.res-bar.resizing  { opacity: .85; z-index: 100; cursor: ew-resize; }
.rg-bar.resizing   { opacity: .85; z-index: 100; cursor: ew-resize; }
.rg-cells.drag-target { background: rgba(201,169,110,.10); outline: 2px dashed var(--accent); outline-offset: -2px; }
.gantt-cells.drag-target { background: rgba(201,169,110,.10); outline: 2px dashed var(--accent); outline-offset: -2px; }
.resize-handle {
  position: absolute; right: 0; top: 0; bottom: 0; width: 8px;
  cursor: ew-resize; z-index: 10; border-radius: 0 5px 5px 0;
  background: transparent; transition: background .15s;
}
.resize-handle:hover { background: rgba(255,255,255,.28); }
.status-confirmed  { background: var(--s-confirmed-bg); color: var(--s-confirmed-fg); border: 1px solid var(--s-confirmed-br); }
.status-pending    { background: var(--s-pending-bg);   color: var(--s-pending-fg);   border: 1px solid var(--s-pending-br);   }
.status-tentative  { background: var(--s-pending-bg);   color: var(--s-pending-fg);   border: 1px solid var(--s-pending-br);   }
.status-checked_in { background: var(--s-checkin-bg);   color: var(--s-checkin-fg);   border: 1px solid var(--s-checkin-br);   }
.status-checked_out{ background: var(--s-checkout-bg);  color: var(--s-checkout-fg);  border: 1px solid var(--s-checkout-br);  }
.status-cancelled  { background: var(--s-cancelled-bg); color: var(--s-cancelled-fg); border: 1px solid var(--s-cancelled-br); }
.today-line { position: absolute; top: 0; bottom: 0; width: 2px;
  background: var(--accent); opacity: .6; pointer-events: none; z-index: 3; }

/* ═══════════════════════════════════════════════════════════
   RESTAURANT GANTT – TAGESPLAN
═══════════════════════════════════════════════════════════ */
.rg-wrap { flex: 1; overflow: auto; position: relative; }
.rg-grid { min-width: max-content; }
.rg-header { display: flex; position: sticky; top: 0; z-index: 10;
  background: var(--surface); border-bottom: 2px solid var(--border); }
.rg-sidebar-cell { width: var(--rg-label-w, 180px); min-width: 80px; flex-shrink: 0; position: sticky; left: 0; z-index: 3; user-select: none;
  padding: 8px 12px; font-size: 11px; font-weight: 600; color: var(--text2);
  border-right: 2px solid var(--border); display: flex; align-items: center; background: var(--bg); }
.rg-hour-cell { flex-shrink: 0; border-right: 1px solid var(--border);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 600; color: var(--text2); }
.rg-hour-cell.current-hour { background: var(--today-overlay);
  color: var(--accent); }
.rg-row { display: flex; border-bottom: 1px solid var(--border); position: relative; }
.rg-row:hover { background: var(--row-hover); }

.rg-label { width: var(--rg-label-w, 180px); min-width: 80px; flex-shrink: 0; overflow: hidden;
  white-space: nowrap; font-size: 12px; border-right: 2px solid var(--border);
  display: flex; align-items: center; gap: 4px; height: 44px; padding: 0 8px;
  position: sticky; left: 0; z-index: 3; background: var(--bg); }
.rg-label .tbl-num { font-weight: 700; color: var(--accent2); font-size: 13px; }
.rg-label .tbl-cap { font-size: 10px; color: var(--text3);
  background: var(--surface2); padding: 1px 5px; border-radius: 3px; }
.rg-cells { display: flex; position: relative; flex: 1; height: 44px; }
.rg-slot { flex-shrink: 0; border-right: 1px solid var(--border);
  height: 100%; cursor: pointer; transition: background .15s; }
.rg-slot:hover { background: var(--slot-hover); }
.rg-slot.current-hour { background: rgba(79,124,255,.05); /* slot-current */ }
.rg-bar { position: absolute; top: 5px; height: 34px; border-radius: 5px;
  cursor: pointer; overflow: hidden; display: flex; align-items: center;
  padding: 0 8px; font-size: 11px; font-weight: 600; white-space: nowrap;
  transition: filter .15s; z-index: 2; }
.rg-bar:hover { filter: brightness(1.1); z-index: 5; }
:root[data-theme="light"] .rg-bar:hover { filter: brightness(.92); }
.rg-bar .bar-time { font-size: 9px; font-weight: 400; opacity: .8; margin-left: 4px; }
.rg-current-line { position: absolute; top: 0; bottom: 0; width: 2px;
  background: #f97316; opacity: .7; pointer-events: none; z-index: 3; }
/* Theater-Blockierung (Scheune) */
.rg-bar.theater-block { background: #7c3aed33; color: #7c3aed; border: 1px dashed #7c3aed88;
  cursor: default; font-weight: 600; pointer-events: auto; }
.rg-bar.theater-block:hover { filter: none; }
.rw-res-chip.theater-block { background: #7c3aed22; color: #7c3aed; border: 1px dashed #7c3aed55;
  font-weight: 600; cursor: default; }
/* Gruppen-Badge auf Buchungsbalken */
.group-badge { position: absolute; top: -1px; right: 22px; width: 8px; height: 8px;
  border-radius: 50%; border: 1.5px solid rgba(255,255,255,.5); z-index: 6;
  pointer-events: none; }
:root[data-theme="light"] .group-badge { border-color: rgba(0,0,0,.25); }
/* Gruppen-Karte im Panel */
.group-card { background: var(--surface2); border: 1px solid var(--border);
  border-radius: 8px; padding: 12px 14px; cursor: pointer; transition: border-color .15s; }
.group-card:hover { border-color: var(--accent); }
.group-card .gc-name { font-weight: 700; font-size: 14px; margin-bottom: 4px; }
.group-card .gc-meta { display: flex; gap: 10px; flex-wrap: wrap; font-size: 11px; color: var(--text2); }
.group-card .gc-badge { padding: 2px 7px; border-radius: 10px; font-size: 10px;
  font-weight: 600; background: var(--surface); }
.group-card .gc-links { margin-top: 6px; font-size: 11px; color: var(--text3); }
/* Verknüpfte Buchung im Formular */
.linked-res { background: var(--surface2); border: 1px solid var(--border);
  border-radius: 6px; padding: 8px 10px; font-size: 12px;
  display: flex; align-items: center; gap: 8px; }
.rg-section-header { background: var(--surface2); height: 26px;
  font-size: 11px; font-weight: 700; color: var(--text2); letter-spacing: .5px; }
/* Aufklappbarer Property-Header im Restaurant-Gantt */
.rg-property-header { background: var(--surface2); border-bottom: 2px solid var(--border);
  display: flex; cursor: pointer; user-select: none; }
.rg-property-header:hover { background: var(--slot-hover); }
.rg-property-label { width: var(--rg-label-w, 180px); min-width: 80px; flex-shrink: 0; position: sticky; left: 0; z-index: 3;
  padding: 0 10px; border-right: 2px solid var(--border); background: var(--bg);
  display: flex; align-items: center; gap: 6px; height: 32px; white-space: nowrap; overflow: hidden; }
.rg-property-label .rph-arrow { font-size: 10px; color: var(--accent); transition: transform .2s; }
.rg-property-label .rph-arrow.open { transform: rotate(90deg); }
.rg-property-label .rph-name { font-weight: 700; font-size: 12px; color: var(--text1);
  overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.rg-property-label .rph-count { font-size: 10px; color: var(--text3);
  background: var(--surface); padding: 1px 5px; border-radius: 3px; }
/* Sitzplatz-Verfügbarkeit in der Stunden-Übersicht */
.rg-avail-cells { display: flex; flex: 1; height: 32px; }
.rg-avail-cell { flex-shrink: 0; border-right: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 700; }
.rg-avail-cell.full { color: #ef4444; }
.rg-avail-cell.low  { color: #f59e0b; }
.rg-avail-cell.ok   { color: #22c55e; }
/* Wochenplan: Verfügbarkeit pro Tag */
.rw-avail-cell { flex-shrink: 0; border-right: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  font-size: 10px; font-weight: 700; }
.rw-avail-cell.full { color: #ef4444; }
.rw-avail-cell.low  { color: #f59e0b; }
.rw-avail-cell.ok   { color: #22c55e; }

/* ═══════════════════════════════════════════════════════════
   RESTAURANT GANTT – WOCHENPLAN
═══════════════════════════════════════════════════════════ */
.rw-wrap { flex: 1; overflow: auto; position: relative; }
.rw-grid { min-width: max-content; }
.rw-header { display: flex; position: sticky; top: 0; z-index: 10;
  background: var(--surface); border-bottom: 2px solid var(--border); }
.rw-sidebar-cell { width: var(--rg-label-w, 180px); min-width: 80px; flex-shrink: 0; position: sticky; left: 0; z-index: 3; user-select: none;
  padding: 8px 12px; font-size: 11px; font-weight: 600; color: var(--text2);
  border-right: 2px solid var(--border); display: flex; align-items: center; background: var(--surface); }
.rw-day-cell { flex-shrink: 0; border-right: 1px solid var(--border);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 6px 4px; }
.rw-day-cell.today { background: var(--today-overlay); }
.rw-day-cell.weekend { background: var(--row-hover); }
.rw-day-name { font-size: 10px; color: var(--text2); }
.rw-day-num { font-size: 13px; font-weight: 700; }
.rw-day-date { font-size: 9px; color: var(--text3); }
.rw-row { display: flex; border-bottom: 1px solid var(--border); }
.rw-label { width: var(--rg-label-w, 180px); min-width: 80px; flex-shrink: 0; overflow: hidden;
  white-space: nowrap; font-size: 12px; border-right: 2px solid var(--border);
  display: flex; align-items: center; gap: 4px; padding: 0 8px;
  position: sticky; left: 0; z-index: 3; background: var(--bg); }
.rw-label .tbl-num { font-weight: 700; color: var(--accent2); font-size: 12px; }
.rw-label .tbl-cap { font-size: 10px; color: var(--text3); margin-left: 4px; }

.rw-day-slot { flex-shrink: 0; border-right: 1px solid var(--border);
  padding: 4px; min-height: 44px; display: flex; flex-direction: column; gap: 2px;
  cursor: pointer; transition: background .15s; vertical-align: top; }
.rw-day-slot:hover { background: var(--slot-hover); }
.rw-day-slot.today { background: rgba(79,124,255,.05); /* slot-current */ }
.rw-res-chip { border-radius: 4px; padding: 2px 6px; font-size: 10px;
  font-weight: 600; cursor: pointer; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; line-height: 1.4; }
.rw-res-chip:hover { filter: brightness(1.2); }

/* ═══════════════════════════════════════════════════════════
   MODAL / FORMS
═══════════════════════════════════════════════════════════ */
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.6);
  display: flex; align-items: center; justify-content: center;
  z-index: 1000; display: none; }
.modal-overlay.open { display: flex; }
.modal { background: var(--surface); border: 1px solid var(--border);
  border-radius: 12px; padding: 28px; width: 480px; max-width: 95vw;
  max-height: 92vh; overflow-y: auto; }
.modal-wide { width: 680px; }
.modal h2 { font-family: 'DM Serif Display', serif; font-size: 18px; margin-bottom: 20px; display: flex;
  align-items: center; gap: 8px; }

/* Kompaktes Buchungsformular – 3 Spalten, kein Scrollen */
.modal-booking { width: 680px; max-width: 96vw; padding: 20px 24px 18px; transition: all .3s ease; }
.modal-booking h2 { margin-bottom: 14px; font-size: 16px; display:flex; align-items:center; gap:8px; }
.modal-booking h2 .modal-fullscreen-btn { margin-left:auto; background:none; border:1px solid var(--border);
  border-radius:6px; padding:4px 8px; cursor:pointer; font-size:14px; color:var(--text2);
  transition:all .2s; line-height:1; flex-shrink:0; }
.modal-booking h2 .modal-fullscreen-btn:hover { background:var(--surface2); border-color:var(--accent); color:var(--text); }
.modal-booking.fullscreen { width:96vw; max-width:96vw; height:92vh; max-height:92vh; padding:28px 40px;
  display:flex; flex-direction:column; }
.modal-booking.fullscreen .form-grid-3 { grid-template-columns:repeat(4, 1fr); gap:16px 20px; flex:1; align-content:start; }
.modal-booking.fullscreen .form-grid-3 .full3 { grid-column: 1 / -1; }
.modal-booking.fullscreen .form-grid-3 input,
.modal-booking.fullscreen .form-grid-3 select { padding:10px 12px !important; font-size:14px !important; }
.modal-booking.fullscreen .form-grid-3 textarea { min-height:120px !important; padding:10px 12px !important; font-size:14px !important; }
.modal-booking.fullscreen .form-grid-3 label { font-size:13px; }
.modal-booking.fullscreen h2 { font-size:20px; margin-bottom:20px; }
.modal-booking.fullscreen .form-actions { margin-top:auto; padding-top:16px; }
.form-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.form-grid-3 .full3 { grid-column: 1 / -1; }
.form-grid-3 .span2  { grid-column: span 2; }
.form-grid-3 .form-group { gap: 3px; }
.form-grid-3 label { font-size: 11px; }
.form-grid-3 input, .form-grid-3 select {
  padding: 6px 8px !important; font-size: 12px !important; }
.form-grid-3 textarea { min-height: 46px !important; padding: 6px 8px !important;
  font-size: 12px !important; resize: none; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-grid .full, .form-grid .full2 { grid-column: 1 / -1; }
.form-group { display: flex; flex-direction: column; gap: 5px; }
.form-group label { font-size: 12px; color: var(--text2); font-weight: 500; }
.form-group input, .form-group select, .form-group textarea {
  background: var(--surface2); border: 1px solid var(--border);
  border-radius: 6px; padding: 8px 10px; color: var(--text);
  font-size: 13px; outline: none; font-family: var(--font); }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  border-color: var(--accent); }
.form-group textarea { resize: vertical; min-height: 70px; }
.form-actions { display: flex; gap: 10px; margin-top: 16px; justify-content: flex-end; }
.modal-booking .form-actions { margin-top: 12px; }
.btn-save { background: var(--accent); border: none; border-radius: 6px;
  padding: 9px 20px; color: #000; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: opacity .2s; }
.btn-save:hover { opacity: .85; }
.btn-cancel { background: var(--surface2); border: 1px solid var(--border);
  border-radius: 6px; padding: 9px 16px; color: var(--text2);
  font-size: 13px; cursor: pointer; transition: all .2s; }
.btn-cancel:hover { background: var(--border); }
.btn-delete { background: var(--red); border: none; border-radius: 6px;
  padding: 9px 16px; color: #fff; font-size: 13px; cursor: pointer;
  margin-right: auto; transition: opacity .2s; }
.btn-delete:hover { opacity: .85; }
.status-badge { display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; }

/* ═══════════════════════════════════════════════════════════
   TOOLTIP
═══════════════════════════════════════════════════════════ */
#tooltip { position: fixed; background: var(--tooltip-bg); color: #fff; border: 1px solid var(--border);
  border-radius: 8px; padding: 10px 14px; font-size: 12px; pointer-events: none;
  z-index: 9999; display: none; max-width: 260px; line-height: 1.6; }
#tooltip .tt-name { font-size: 14px; font-weight: 700; margin-bottom: 4px; color: #fff; }
#tooltip .tt-row { display: flex; gap: 6px; color: rgba(255,255,255,.75); }
#tooltip .tt-row span { color: #fff; }

/* ═══════════════════════════════════════════════════════════
   SEARCH
═══════════════════════════════════════════════════════════ */
#searchOverlay { position: fixed; inset: 0; background: rgba(0,0,0,.7);
  display: none; z-index: 500; align-items: flex-start; justify-content: center;
  padding-top: 80px; }
#searchOverlay.open { display: flex; }
.search-box { background: var(--surface); border: 1px solid var(--border);
  border-radius: 12px; width: 560px; max-width: 95vw; overflow: hidden; }
.search-input-wrap { display: flex; align-items: center; padding: 14px 16px; gap: 10px;
  border-bottom: 1px solid var(--border); }
.search-input-wrap input { flex: 1; background: none; border: none; color: var(--text);
  font-size: 16px; outline: none; }
.search-results { max-height: 340px; overflow-y: auto; }
.search-item { padding: 10px 16px; cursor: pointer; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; gap: 10px; transition: background .15s; }
.search-item:hover { background: var(--surface2); }
.search-item-icon { font-size: 18px; }
.search-item-main { flex: 1; }
.search-item-title { font-size: 13px; font-weight: 600; }
.search-item-sub { font-size: 11px; color: var(--text2); }
.search-empty { padding: 20px; text-align: center; color: var(--text2); font-size: 13px; }

/* ═══════════════════════════════════════════════════════════
   MISC
═══════════════════════════════════════════════════════════ */
.kbd { background: var(--surface2); border: 1px solid var(--border); border-radius: 3px;
  padding: 1px 5px; font-size: 10px; color: var(--text2); }
.spinner { display: inline-block; width: 14px; height: 14px; border: 2px solid var(--border);
  border-top-color: var(--accent); border-radius: 50%; animation: spin .6s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.loading-overlay { position: absolute; inset: 0; background: var(--loading-overlay);
  display: flex; align-items: center; justify-content: center; z-index: 50;
  font-size: 13px; color: var(--text2); gap: 10px; }

/* ═══════════════════════════════════════════════════════════
   DRAG-TO-CREATE GHOST
═══════════════════════════════════════════════════════════ */
.drag-create-ghost {
  position: absolute; top: 4px; height: 32px; border-radius: 5px;
  background: rgba(79,124,255,.25); border: 2px dashed #4f7cff;
  pointer-events: none; z-index: 10;
  display: flex; align-items: center; padding: 0 8px;
  font-size: 11px; color: #4f7cff; font-weight: 700;
  white-space: nowrap; transition: width .05s;
}
.drag-create-ghost-rg {
  position: absolute; top: 5px; height: 34px; border-radius: 5px;
  background: rgba(124,79,255,.25); border: 2px dashed #7c4fff;
  pointer-events: none; z-index: 10;
  display: flex; align-items: center; padding: 0 8px;
  font-size: 11px; color: #a78bfa; font-weight: 700;
  white-space: nowrap;
}
/* Cursor-Hinweis auf leeren Zellen */
.gantt-cells { cursor: crosshair; }
.rg-cells    { cursor: crosshair; }

/* ═══════════════════════════════════════════════════════════
   PREISMODUL
═══════════════════════════════════════════════════════════ */
.price-wrap { flex: 1; overflow: auto; padding: 20px; }
.price-property-block { margin-bottom: 32px; }
.price-property-title {
  font-size: 14px; font-weight: 700; color: var(--accent);
  padding: 8px 0; margin-bottom: 12px;
  border-bottom: 2px solid var(--accent);
  display: flex; align-items: center; gap: 10px;
}
.price-table { width: 100%; border-collapse: collapse; font-size: 12px;
  background: var(--surface); border-radius: 8px; overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,.1); }
.price-table th { background: var(--surface2); color: var(--text2);
  font-weight: 600; padding: 8px 12px; text-align: center;
  border-bottom: 2px solid var(--border); font-size: 11px; }
.price-table th.room-col { text-align: left; width: 180px; }
.price-table td { padding: 7px 12px; border-bottom: 1px solid var(--border);
  text-align: center; color: var(--text); }
.price-room-badge { display:inline-flex; align-items:center; justify-content:center;
  background:var(--accent); color:#000; font-weight:800; font-size:12px;
  min-width:30px; height:20px; padding:0 6px; border-radius:4px; line-height:1; }
.price-room-type { display:block; font-size:11px; color:var(--text2); margin-top:3px;
  font-weight:500; line-height:1.3; }
.price-table tr:last-child td { border-bottom: none; }
.price-table tr:hover td { background: var(--surface2); }
.price-cell { cursor: pointer; border-radius: 4px; transition: all .15s;
  padding: 4px 8px !important; position:relative; }
.price-cell:hover { background: var(--accent) !important; color: #fff !important; }
.price-add-btn { display:none; position:absolute; bottom:2px; right:2px; width:18px; height:18px;
  border-radius:50%; background:var(--accent); color:#000; border:none; font-size:13px;
  font-weight:700; line-height:18px; text-align:center; cursor:pointer; padding:0; z-index:2; }
.price-add-btn:hover { opacity:.85; }
.price-cell:hover .price-add-btn { display:block; background:#fff; color:var(--accent); }
.perm-readonly .price-add-btn { display:none !important; }
.price-cell.has-weekend { position: relative; }
.price-val { display: block; font-weight: 700; font-size: 12px; }
.price-we  { display: block; font-size: 10px; color: var(--orange); margin-top: 1px; }
.price-na  { color: var(--text3); font-size: 11px; }
/* Read-only Modus (RBAC) */
.perm-readonly .price-cell { cursor: default; }
.perm-readonly .price-cell:hover { background: transparent !important; color: inherit !important; }
/* ═══ HOUSEKEEPING ═══ */
/* Statistik Dashboard */
.stats-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:20px}
.stats-kpi{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:16px 20px;
  display:flex;flex-direction:column;gap:4px}
.stats-kpi .kpi-label{font-size:11px;color:var(--text2);text-transform:uppercase;letter-spacing:.5px}
.stats-kpi .kpi-value{font-size:24px;font-weight:700;color:var(--text);font-family:'DM Serif Display',serif}
.stats-kpi .kpi-sub{font-size:11px;color:var(--text2)}
.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.stats-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:20px}
.stats-card h3{font-size:13px;color:var(--text2);margin:0 0 12px;font-weight:600}
.stats-card canvas{max-height:280px}
.stats-top-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;
  border-bottom:1px solid var(--border);font-size:13px}
.stats-top-row:last-child{border-bottom:none}
.stats-top-row .rank{color:var(--text2);width:24px;font-weight:600}
.stats-top-row .name{flex:1;color:var(--text)}
.stats-top-row .amount{font-weight:600;color:var(--accent)}
@media(max-width:900px){.stats-grid{grid-template-columns:1fr}}

.hk-wrap { padding: 16px 20px; display: flex; flex-direction: column; gap: 12px; }
.hk-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; }
.hk-header-left { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.hk-header-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.hk-stats { display: flex; gap: 12px; font-size: 12px; color: var(--text2); }
.hk-stats strong { color: var(--text); }
.hk-filters { display: flex; gap: 6px; flex-wrap: wrap; }
.hk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.hk-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  padding: 14px; display: flex; flex-direction: column; gap: 8px; transition: border-color .2s; }
.hk-card:hover { border-color: var(--accent); }
.hk-card.prio-urgent  { border-left: 4px solid var(--red); }
.hk-card.prio-clean   { border-left: 4px solid var(--yellow); }
.hk-card.prio-prepare { border-left: 4px solid var(--green); }
.hk-card.prio-none    { border-left: 4px solid var(--border); }
.hk-card.status-inspected { opacity: .55; }
.hk-card-top { display: flex; justify-content: space-between; align-items: center; }
.hk-card-room { font-size: 18px; font-weight: 700; }
.hk-card-type { font-size: 11px; color: var(--text2); margin-left: 6px; }
.hk-card-prio { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 10px; white-space: nowrap; }
.hk-prio-urgent  { background: var(--red); color: #fff; }
.hk-prio-clean   { background: var(--yellow); color: #000; }
.hk-prio-prepare { background: var(--green); color: #fff; }
.hk-prio-none    { background: var(--surface2); color: var(--text2); }
.hk-card-guest { font-size: 12px; color: var(--text2); }
.hk-card-row { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.hk-status-btn { font-size: 11px; padding: 3px 10px; border-radius: 12px; font-weight: 600; cursor: pointer; border: 1px solid; background: transparent; }
.hk-status-btn.active { font-weight: 800; color: #fff !important; }
.hk-card.status-inspected { opacity: .65; border-color: var(--blue); }
.hk-status-dirty       { color: var(--red);    border-color: var(--red); }
.hk-status-dirty.active       { background: var(--red); }
.hk-status-in_progress { color: var(--yellow); border-color: var(--yellow); }
.hk-status-in_progress.active { background: var(--yellow); color: #000 !important; }
.hk-status-clean       { color: var(--green);  border-color: var(--green); }
.hk-status-clean.active       { background: var(--green); }
.hk-status-inspected   { color: var(--blue);   border-color: var(--blue); }
.hk-status-inspected.active   { background: var(--blue); }
.hk-timer { font-family: monospace; font-size: 13px; letter-spacing: .5px; }
.hk-progress { height: 4px; background: var(--surface2); border-radius: 2px; overflow: hidden; flex: 1; }
.hk-progress-bar { height: 100%; background: var(--green); transition: width .3s; }
.hk-card-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.hk-card-actions button { font-size: 11px; padding: 4px 10px; }
.hk-section { margin-top: 12px; }
.hk-section-title { font-size: 14px; font-weight: 600; padding: 6px 0; border-bottom: 1px solid var(--border); margin-bottom: 8px; }
.hk-checklist label { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--surface2); cursor: pointer; font-size: 13px; }
.hk-checklist input[type=checkbox] { width: 18px; height: 18px; }
.hk-minibar-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--surface2); font-size: 13px; }
.hk-minibar-row input { width: 50px; text-align: center; }
@media (max-width: 640px) { .hk-grid { grid-template-columns: 1fr; } .hk-header { flex-direction: column; align-items: stretch; } }
/* Edit Modal */
.price-edit-modal { width: 460px; max-height:85vh; overflow-y:auto; }
.price-edit-modal h2 { font-size: 16px; }
.price-edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
.price-hint { font-size: 11px; color: var(--text2); margin-top: 8px; line-height: 1.5; }
.price-season-section { background: var(--surface2); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; margin-bottom: 12px; position:relative; }
.price-season-title { font-size: 12px; font-weight: 600; color: var(--accent); margin-bottom: 10px; display:flex; align-items:center; justify-content:space-between; }
.price-season-section .price-edit-grid { margin-top: 0; }
.pe-row-remove { background:none; border:none; color:var(--red); cursor:pointer; font-size:16px; padding:2px 6px; border-radius:4px; opacity:.7; }
.pe-row-remove:hover { opacity:1; background:rgba(224,107,107,.1); }
.pe-add-row { display:flex; align-items:center; gap:6px; background:none; border:1px dashed var(--border);
  border-radius:var(--radius); padding:10px 16px; color:var(--accent); cursor:pointer; font-size:12px;
  font-weight:600; width:100%; margin-bottom:12px; transition:all .2s; }
.pe-add-row:hover { border-color:var(--accent); background:rgba(201,169,110,.06); }
.pe-add-row .pe-add-icon { width:22px; height:22px; border-radius:50%; background:var(--accent); color:#000;
  display:inline-flex; align-items:center; justify-content:center; font-size:16px; font-weight:700; }
.price-season-badge { font-size: 9px; color: var(--accent); display: block; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.price-cell .min-stay-badge { font-size: 9px; color: var(--text2); display: block; }
/* ─── Massenverwaltung ─── */
.price-mass-toolbar { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
  padding:12px 16px; margin-bottom:16px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.price-mass-toolbar label { font-size:11px; color:var(--text2); font-weight:600; }
.price-mass-toolbar select, .price-mass-toolbar input[type="number"] { background:var(--surface2);
  border:1px solid var(--border); border-radius:6px; padding:5px 10px; color:var(--text);
  font-size:12px; outline:none; }
.price-mass-toolbar select:focus, .price-mass-toolbar input:focus { border-color:var(--accent); }
.price-mass-group { display:flex; align-items:center; gap:6px; }
.price-mass-apply { background:var(--accent); color:#000; border:none; border-radius:6px;
  padding:6px 16px; font-size:12px; font-weight:600; cursor:pointer; transition:opacity .2s; }
.price-mass-apply:hover { opacity:.85; }

/* ═══════════════════════════════════════════════════════════
   RECHNUNGSMODUL
═══════════════════════════════════════════════════════════ */
.inv-wrap { flex: 1; overflow: auto; padding: 20px; }
.inv-toolbar { display: flex; align-items: center; gap: 10px;
  margin-bottom: 16px; }
/* Rechnungsliste */
.inv-list-item { background: var(--surface); border: 1px solid var(--border);
  border-radius: 8px; padding: 14px 18px; margin-bottom: 10px;
  display: flex; align-items: center; gap: 16px; cursor: pointer;
  transition: all .15s; }
.inv-list-item:hover { border-color: var(--accent); background: var(--surface2); }
.inv-num { font-weight: 700; font-size: 13px; color: var(--accent); min-width: 120px; }
.inv-guest { flex: 1; font-size: 13px; }
.inv-date { font-size: 11px; color: var(--text2); min-width: 90px; }
.inv-total { font-weight: 700; font-size: 14px; min-width: 80px; text-align: right; }
.inv-status-badge { padding: 2px 9px; border-radius: 10px; font-size: 11px;
  font-weight: 600; min-width: 80px; text-align: center; }
.inv-status-draft     { background: var(--surface2); color: var(--text2); border: 1px solid var(--border); }
.inv-status-sent      { background: #dbeafe; color: #1e3a8a; }
.inv-status-paid      { background: #dcfce7; color: #14532d; }
.inv-status-cancelled { background: #fee2e2; color: #7f1d1d; }
:root[data-theme="light"] .inv-status-sent { background: #dbeafe; }

/* Rechnungs-Editor Modal */
.modal-invoice { width: 780px; max-width: 97vw; padding: 22px 26px 18px; }
.modal-invoice h2 { margin-bottom: 12px; font-size: 15px; }
.inv-header-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-bottom: 14px; }
.inv-header-grid .span2 { grid-column: span 2; }
.inv-header-grid .form-group { gap: 3px; }
.inv-header-grid label { font-size: 11px; }
.inv-header-grid input, .inv-header-grid select, .inv-header-grid textarea {
  padding: 6px 8px !important; font-size: 12px !important; }
/* Positionen-Tabelle */
.inv-items-wrap { margin: 14px 0; }
.inv-items-label { font-size: 11px; font-weight: 600; color: var(--text2);
  margin-bottom: 6px; text-transform: uppercase; letter-spacing: .5px; }
.inv-items-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.inv-items-table th { background: var(--surface2); color: var(--text2);
  padding: 6px 8px; text-align: left; font-size: 11px; font-weight: 600;
  border-bottom: 2px solid var(--border); }
.inv-items-table th.num { text-align: right; }
.inv-items-table td { padding: 5px 6px; border-bottom: 1px solid var(--border);
  vertical-align: middle; }
.inv-items-table tr:last-child td { border-bottom: none; }
.inv-items-table input { background: var(--surface2); border: 1px solid transparent;
  border-radius: 4px; padding: 4px 6px; color: var(--text); font-size: 12px;
  width: 100%; outline: none; }
.inv-items-table input:focus { border-color: var(--accent); background: var(--surface); }
.inv-items-table .td-pos { width: 30px; text-align: center; color: var(--text3); font-size: 11px; }
.inv-items-table .td-desc { }
.inv-items-table .td-qty  { width: 70px; }
.inv-items-table .td-unit { width: 70px; }
.inv-items-table .td-price{ width: 90px; }
.inv-items-table .td-total{ width: 90px; font-weight: 600; text-align: right;
  color: var(--text); padding-right: 8px; }
.inv-items-table .td-vat  { width: 52px; text-align: center; }
.inv-items-table .td-vat select { width: 48px; padding: 2px 2px; font-size: 11px;
  border: 1px solid var(--border); border-radius: 4px; background: var(--surface2);
  color: var(--text); cursor: pointer; }
.inv-items-table .td-del  { width: 28px; text-align: center; }
/* MwSt-Aufschlüsselung im Modal */
.inv-vat-box { margin-top: 8px; border-top: 1px solid var(--border); padding-top: 8px; }
.inv-vat-row { display: flex; justify-content: flex-end; gap: 20px;
  font-size: 12px; color: var(--text2); padding: 2px 0; }
.inv-vat-row.subtotal { color: var(--text); }
.inv-vat-row.grand-total { font-size: 14px; font-weight: 700; color: var(--accent);
  border-top: 1px solid var(--border); padding-top: 6px; margin-top: 4px; }
/* Rabatt-Zeilen in Rechnungstabelle */
.discount-row td { border-top: 1px dashed var(--border); font-style: italic; }
.discount-row .td-total { color: var(--green); }
.discount-row .td-desc input { color: var(--green); font-style: italic; }

/* ── Split-Modus (Side-by-Side) ───────────────────── */
.modal-invoice { transition: width .3s ease; }
.modal-invoice.split-active { width: 1400px; }
.inv-split-container { display: flex; gap: 0; }
.inv-panel-left { flex: 1; min-width: 0; }
.inv-panel-right { flex: 1; min-width: 0; padding-left: 20px; border-left: 2px solid var(--accent);
  display: none; overflow-y: auto; }
.modal-invoice.split-active .inv-panel-left { padding-right: 20px; }
.modal-invoice.split-active .inv-panel-right { display: block; }
/* Split-Header */
.inv-split-header { display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 14px; padding-bottom: 10px; border-bottom: 2px solid var(--accent); }
.inv-split-header h3 { font-size: 15px; font-weight: 700; color: var(--accent); margin: 0; }
/* Empfänger-Bereich */
.inv-panel-right .inv-split-recipient { margin-bottom: 14px; }
.inv-panel-right .inv-split-recipient .split-row { display: flex; gap: 10px; margin-bottom: 8px; }
.inv-panel-right .inv-split-recipient .split-row > div { flex: 1; }
.inv-panel-right .inv-split-recipient label { font-size: 11px; font-weight: 600; color: var(--text2);
  display: block; margin-bottom: 3px; text-transform: uppercase; letter-spacing: .5px; }
.inv-panel-right .inv-split-recipient input { width: 100%; padding: 6px 8px; border: 1px solid var(--border);
  border-radius: 6px; font-size: 12px; background: var(--bg); color: var(--text); box-sizing: border-box; }
/* Items Drop-Zone */
.inv-split-items-wrap { margin: 10px 0; min-height: 80px; border-radius: 8px;
  transition: background .2s, border-color .2s; }
.inv-split-items-wrap.drag-over { background: color-mix(in srgb, var(--accent) 8%, transparent);
  outline: 2px dashed var(--accent); outline-offset: -2px; }
.inv-split-drop-hint { text-align: center; padding: 28px 12px; color: var(--text3);
  font-size: 12px; font-style: italic; border: 2px dashed var(--border); border-radius: 8px;
  background: var(--surface2); }
/* Summen */
.inv-split-summary { border-top: 2px solid var(--border); padding-top: 8px;
  display: flex; flex-direction: column; align-items: flex-end; gap: 3px; font-size: 12px; }
/* Zahlungsart */
.inv-panel-right .inv-split-pay { margin-top: 14px; }
.inv-panel-right .inv-split-pay-label { font-size: 11px; font-weight: 600; color: var(--text2);
  text-transform: uppercase; letter-spacing: .5px; display: block; margin-bottom: 8px; }
.inv-panel-right .split-pay-row { display: flex; gap: 8px; flex-direction: row; }
.inv-panel-right .split-pay-row .inv-pay-btn { flex: 1; min-width: 0; padding: 8px 6px; font-size: 11px; }
/* Aktions-Buttons */
.inv-panel-right .inv-split-actions { display: flex; gap: 8px; margin-top: 16px; padding-top: 14px;
  border-top: 1px solid var(--border); flex-wrap: wrap; }
/* Vorgang schliessen */
.inv-close-row { margin-top: 16px; padding-top: 14px; border-top: 2px solid var(--border); text-align: center; }
.inv-close-row .btn-cancel { font-size: 13px; padding: 8px 24px; }
/* Move-Buttons */
.inv-items-table .td-move { width: 32px; text-align: center; }
.inv-move-btn { background: none; border: 1px solid var(--border); color: var(--accent);
  cursor: pointer; font-size: 14px; padding: 2px 6px; border-radius: 4px;
  transition: all .15s; font-weight: 700; line-height: 1; }
.inv-move-btn:hover { background: var(--accent); color: #fff; border-color: var(--accent); }
/* Drag-Styles */
.inv-items-table tr[draggable="true"] { cursor: grab; }
.inv-items-table tr[draggable="true"]:active { cursor: grabbing; }
.inv-items-table tr.dragging { opacity: .4; }
.inv-items-wrap.drag-over { background: color-mix(in srgb, var(--accent) 6%, transparent);
  outline: 2px dashed var(--accent); outline-offset: -2px; border-radius: 8px; }
/* Responsive */
@media (max-width: 900px) {
  .modal-invoice.split-active { width: 97vw; }
  .inv-split-container { flex-direction: column; }
  .modal-invoice.split-active .inv-panel-left { padding-right: 0; padding-bottom: 16px; }
  .inv-panel-right { padding-left: 0; padding-top: 16px; border-left: none; border-top: 2px solid var(--accent); }
}

/* ── Schichtabrechnung Modal ────────────────────────── */
.shift-close-modal { max-width: 720px; width: 95vw; max-height: 90vh; display: flex; flex-direction: column; }
.sc-toolbar { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 16px;
  padding-bottom: 14px; border-bottom: 1px solid var(--border); }
.sc-field { display: flex; flex-direction: column; gap: 3px; }
.sc-field label { font-size: 11px; font-weight: 600; color: var(--text2); text-transform: uppercase; }
.sc-field input, .sc-field select { padding: 6px 10px; background: var(--surface); border: 1px solid var(--border);
  border-radius: 6px; color: var(--text); font-size: 13px; }
.sc-report-area { flex: 1; overflow-y: auto; min-height: 200px; max-height: 55vh; }
.sc-placeholder { text-align: center; color: var(--text3); font-size: 13px; padding: 40px 0; }
.sc-actions { display: flex; gap: 10px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); }
/* Report-Tabelle */
.sc-report { font-size: 12px; color: var(--text); }
.sc-report h3 { font-size: 14px; font-weight: 700; color: var(--accent); margin: 18px 0 8px;
  padding-bottom: 4px; border-bottom: 2px solid var(--accent); }
.sc-report h3:first-child { margin-top: 0; }
.sc-report table { width: 100%; border-collapse: collapse; margin-bottom: 6px; }
.sc-report th { text-align: left; font-size: 10px; font-weight: 700; color: var(--text2);
  text-transform: uppercase; padding: 4px 6px; border-bottom: 1px solid var(--border); }
.sc-report td { padding: 4px 6px; border-bottom: 1px solid var(--border); }
.sc-report td.r, .sc-report th.r { text-align: right; }
.sc-report .sc-subtotal { font-weight: 700; background: var(--surface2); }
.sc-report .sc-pay-split { font-size: 11px; color: var(--text2); padding: 4px 6px; margin-bottom: 14px; }
.sc-grand { background: var(--surface2); border-radius: 8px; padding: 14px; margin-top: 16px; }
.sc-grand h3 { margin: 0 0 10px; border: none; padding: 0; }
.sc-grand-row { display: flex; justify-content: space-between; padding: 3px 0; font-size: 13px; }
.sc-grand-row.total { font-size: 16px; font-weight: 700; color: var(--accent);
  border-top: 2px solid var(--border); padding-top: 8px; margin-top: 6px; }
.sc-grand-row .label { color: var(--text2); }
.sc-vat-block { margin: 8px 0 14px; padding: 8px 10px; background: var(--surface2); border-radius: 6px; font-size: 12px; }
.sc-vat-label { font-weight: 700; font-size: 11px; text-transform: uppercase; color: var(--text3);
  letter-spacing: 0.5px; margin-bottom: 4px; }
.sc-vat-row { display: grid; grid-template-columns: auto 80px auto 80px auto 80px; gap: 4px 8px;
  padding: 2px 0; align-items: center; }
.sc-vat-row span:nth-child(odd) { color: var(--text2); font-size: 11px; }
.sc-vat-row span:nth-child(even) { text-align: right; font-weight: 600; }
.sc-vat-row.sc-vat-total { border-top: 1px solid var(--border); margin-top: 4px; padding-top: 4px; font-weight: 700; }
.sc-vat-row.sc-vat-total span:nth-child(odd) { color: var(--text1); }
.sc-signature { margin-top: 30px; display: flex; gap: 40px; }
.sc-signature div { flex: 1; border-top: 1px solid var(--text3); padding-top: 6px;
  font-size: 11px; color: var(--text3); text-align: center; }
.inv-vat-row span:last-child { min-width: 90px; text-align: right; }
.inv-del-btn { background: none; border: none; color: var(--text3); cursor: pointer;
  font-size: 14px; padding: 2px 4px; border-radius: 3px; transition: all .15s; }
.inv-del-btn:hover { color: var(--red); background: var(--surface2); }
.inv-add-row { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
/* Summenzeile */
.inv-summary { border-top: 2px solid var(--border); padding-top: 10px;
  display: flex; flex-direction: column; align-items: flex-end; gap: 4px;
  font-size: 13px; }
.inv-summary .inv-sum-row { display: flex; gap: 24px; justify-content: flex-end; }
.inv-summary .inv-sum-row.total { font-weight: 700; font-size: 15px; color: var(--accent);
  border-top: 1px solid var(--border); padding-top: 6px; margin-top: 4px; }

/* Zahlungsart */
.inv-payment-row { display: flex; gap: 8px; }

/* ── FOLLOW-UP BADGE ────────────────────────────────────── */
.followup-badge { background: #ef4444; color: #fff; border-radius: 10px;
  padding: 1px 6px; font-size: 10px; font-weight: 700; margin-left: 4px; }

/* ── FOLLOW-UP POPUP (persistent, always on top) ────────── */
.followup-popup { position: fixed; bottom: 20px; right: 20px; z-index: 9999;
  width: 320px; background: var(--surface); border: 1px solid var(--accent);
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,.35);
  animation: fup-slide-in .3s ease; }
@keyframes fup-slide-in {
  from { transform: translateY(20px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}
.fup-header { display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px 8px; border-bottom: 1px solid var(--border); }
.fup-title { font-weight: 700; font-size: 13px; color: var(--accent); }
.fup-close { background: none; border: none; color: var(--text2); cursor: pointer;
  font-size: 14px; padding: 2px 4px; border-radius: 4px; }
.fup-close:hover { background: var(--surface2); }
.fup-content { padding: 10px 14px; font-size: 13px; }
.fup-guest { font-weight: 700; font-size: 14px; margin-bottom: 3px; }
.fup-detail { font-size: 12px; color: var(--text2); margin-bottom: 6px; }
.fup-note { font-size: 12px; background: var(--surface2); border-radius: 6px;
  padding: 6px 8px; color: var(--text); font-style: italic; }
.fup-counter { font-size: 11px; color: var(--text2); margin-top: 6px; }
.fup-snooze-row { display: flex; align-items: center; gap: 6px;
  padding: 8px 12px; border-top: 1px solid var(--border); flex-wrap: wrap; }
.fup-snooze-btn { background: var(--surface2); border: 1px solid var(--border);
  border-radius: 6px; padding: 4px 10px; font-size: 12px; cursor: pointer;
  color: var(--text); transition: all .15s; }
.fup-snooze-btn:hover { border-color: var(--accent); color: var(--accent); }
.fup-nav-row { display: flex; justify-content: space-between; align-items: center;
  padding: 4px 12px; font-size: 11px; color: var(--text2); }
.fup-nav-btn { background: none; border: 1px solid var(--border); border-radius: 4px;
  padding: 2px 8px; cursor: pointer; color: var(--text2); font-size: 11px; }
.fup-nav-btn:hover { border-color: var(--accent); color: var(--accent); }

/* ── LISTEN MENÜ ────────────────────────────────────────── */
.lists-menu-modal { max-width: 780px; width: 95vw; }
.lists-menu-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 640px) { .lists-menu-grid { grid-template-columns: 1fr; } }
.lm-section { background: var(--surface2); border-radius: 10px; padding: 12px; }
.lm-section-title { font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: var(--text2); margin-bottom: 8px; }
.lm-item { width: 100%; display: flex; align-items: center; gap: 8px;
  padding: 8px 10px; background: var(--surface); border: 1px solid var(--border);
  border-radius: 7px; cursor: pointer; margin-bottom: 6px; transition: all .15s;
  text-align: left; color: var(--text); }
.lm-item:last-child { margin-bottom: 0; }
.lm-item:hover { border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 6%, transparent); }
.lm-item.lm-highlight { border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, transparent); }
.lm-item.lm-disabled { opacity: .5; cursor: not-allowed; }
.lm-item.lm-disabled:hover { border-color: var(--border); background: var(--surface); }
.lm-icon { font-size: 15px; flex-shrink: 0; }
.lm-label { flex: 1; font-size: 13px; }
.lm-kbd { font-size: 10px; background: var(--surface2); border: 1px solid var(--border);
  border-radius: 3px; padding: 1px 5px; color: var(--text2); }

/* Listen-Inhalt Tabelle */
.lists-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.lists-table th { background: var(--surface2); padding: 8px 10px; text-align: left;
  font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--text2);
  border-bottom: 2px solid var(--border); position: sticky; top: 0; }
.lists-table td { padding: 9px 10px; border-bottom: 1px solid var(--border); }
.lists-table tr:hover td { background: color-mix(in srgb, var(--accent) 4%, transparent); }
.lists-table tr:last-child td { border-bottom: none; }
.lt-status { display: inline-block; padding: 2px 8px; border-radius: 10px;
  font-size: 11px; font-weight: 600; }
.lt-link { color: var(--accent); cursor: pointer; font-weight: 600; }
.lt-link:hover { text-decoration: underline; }

/* ── GRUPPEN-RECHNUNGS-DIALOG ───────────────────────────── */
.gi-prop-row { background: var(--surface2); border: 1px solid var(--border);
  border-radius: 8px; padding: 12px 14px; }
.gi-prop-info { display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.gi-prop-info strong { font-size: 14px; }
.gi-prop-sub { font-size: 11px; color: var(--text2); }
.gi-prop-rooms { display: flex; flex-wrap: wrap; gap: 5px; }
.gi-room-chip { background: var(--surface); border: 1px solid var(--border);
  border-radius: 4px; padding: 2px 7px; font-size: 11px; color: var(--text2); }
.inv-pay-btn { flex: 1; display: flex; flex-direction: column; align-items: center;
  gap: 3px; padding: 10px 8px; background: var(--surface2);
  border: 2px solid var(--border); border-radius: 8px; cursor: pointer;
  font-size: 13px; font-weight: 600; color: var(--text); transition: all .15s; }
.inv-pay-btn:hover { border-color: var(--accent); }
.inv-pay-btn.active { border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  color: var(--accent); }
.inv-pay-sub { font-size: 10px; font-weight: 400; color: var(--text2);
  letter-spacing: .02em; }
.inv-pay-btn.active .inv-pay-sub { color: var(--accent); opacity: .75; }

/* ── SETTINGS SUB-NAVIGATION ────────────────────────────── */
.settings-subnav { display: flex; gap: 4px; margin-bottom: 20px;
  border-bottom: 2px solid var(--border); padding-bottom: 0; flex-wrap: wrap; }
.snav-btn { background: none; border: none; border-bottom: 3px solid transparent;
  margin-bottom: -2px; padding: 8px 16px; cursor: pointer; font-size: 13px;
  color: var(--text2); transition: all .15s; border-radius: 6px 6px 0 0; }
.snav-btn:hover  { color: var(--text); background: var(--surface2); }
.snav-btn.active { color: var(--accent); border-bottom-color: var(--accent);
  font-weight: 600; }
.settings-page { display: none; }
.settings-page.active { display: block; }

/* ── BENUTZER-LISTE ─────────────────────────────────────── */
.user-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.user-table th { background: var(--surface2); padding: 8px 12px; text-align: left;
  font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--text2);
  border-bottom: 2px solid var(--border); }
.user-table td { padding: 10px 12px; border-bottom: 1px solid var(--border);
  vertical-align: middle; }
.user-table tr:hover td { background: color-mix(in srgb,var(--accent) 4%,transparent); }
.user-role-badge { display: inline-block; padding: 2px 8px; border-radius: 10px;
  font-size: 11px; font-weight: 600; }
.role-admin    { background:#fef3c7;color:#92400e; }
.role-manager  { background:#dbeafe;color:#1e40af; }
.role-rezeption{ background:#dcfce7;color:#166534; }
.role-service  { background:#f3e8ff;color:#6b21a8; }
.user-inactive { opacity: .45; }
.user-edit-btn { font-size: 12px; padding: 3px 10px; }

/* ── GÄSTE-TAB ──────────────────────────────────────────── */
.guests-wrap { margin: 0 auto; padding: 16px 20px; height: 100%; display: flex; flex-direction: column; }
.guests-header { margin-bottom: 12px; flex-shrink: 0; }
.guests-search-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin-bottom: 12px; }
.guests-search-box { flex: 1; min-width: 220px; display: flex; align-items: center;
  background: var(--surface2); border: 1px solid var(--border); border-radius: 8px;
  padding: 0 12px; gap: 8px; }
.guests-search-box input { flex: 1; background: none; border: none; outline: none;
  padding: 10px 0; color: var(--text); font-size: 14px; }
.guests-search-icon { font-size: 14px; color: var(--text2); }
.guests-filter-row { display: flex; gap: 6px; }
.gc-filter-btn { padding: 6px 14px; border: 1px solid var(--border); border-radius: 20px;
  background: var(--surface2); color: var(--text2); cursor: pointer; font-size: 12px;
  transition: all .15s; }
.gc-filter-btn.active, .gc-filter-btn:hover { background: var(--accent);
  color: #fff; border-color: var(--accent); }
.guests-stats-bar { display: flex; gap: 20px; flex-wrap: wrap; }
.gs-stat { font-size: 12px; color: var(--text2); }
.gs-stat strong { color: var(--accent); font-size: 16px; margin-right: 3px; }

/* Gästeliste */
.guests-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
  gap: 12px; }
.guest-card { background: var(--surface2); border: 1px solid var(--border);
  border-radius: 10px; padding: 14px 16px; cursor: pointer; transition: all .15s;
  display: flex; gap: 12px; align-items: flex-start; }
.guest-card:hover { border-color: var(--accent);
  box-shadow: 0 2px 12px rgba(0,0,0,.12); }
.guest-card-avatar { width: 42px; height: 42px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 16px;
  font-weight: 700; background: color-mix(in srgb, var(--accent) 20%, transparent);
  color: var(--accent); }
.guest-card-info { flex: 1; min-width: 0; }
.gc-name { font-weight: 700; font-size: 14px; display: flex; align-items: center; gap: 6px; }
.gc-vip { font-size: 11px; }
.gc-sub { font-size: 11px; color: var(--text2); margin-top: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gc-meta-row { display: flex; gap: 10px; margin-top: 6px; flex-wrap: wrap; }
.gc-stat-pill { font-size: 11px; background: var(--surface);
  border: 1px solid var(--border); border-radius: 4px; padding: 2px 7px; color: var(--text2); }
.gc-stat-pill.highlight { color: var(--accent); border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, transparent); }

/* ── Gäste Hybrid-Layout ─────────────────────────────────── */
.guests-content { display: flex; gap: 0; flex: 1; min-height: 0; overflow: hidden; }
.guest-table-wrap { flex: 1; overflow-y: auto; border: 1px solid var(--border);
  border-radius: var(--radius); }
.guest-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.guest-table thead { position: sticky; top: 0; z-index: 2; }
.guest-table th { background: var(--surface); padding: 8px 10px; text-align: left;
  font-weight: 600; font-size: 11px; color: var(--text2); border-bottom: 2px solid var(--border);
  cursor: pointer; user-select: none; white-space: nowrap; }
.guest-table th:hover { color: var(--accent); }
.guest-table th .sort-arrow { font-size: 10px; margin-left: 3px; opacity: .4; }
.guest-table th.sorted .sort-arrow { opacity: 1; color: var(--accent); }
.guest-table td { padding: 7px 10px; border-bottom: 1px solid var(--border);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 180px; }
.guest-table tbody tr { cursor: pointer; transition: background .1s; }
.guest-table tbody tr:hover { background: color-mix(in srgb, var(--accent) 6%, transparent); }
.guest-table tbody tr.active { background: color-mix(in srgb, var(--accent) 14%, transparent);
  outline: 2px solid var(--accent); outline-offset: -2px; }
.guest-type-badge { display: inline-block; padding: 2px 8px; border-radius: 10px;
  font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .3px; }
.guest-type-badge.private { background: var(--surface); color: var(--text2); border: 1px solid var(--border); }
.guest-type-badge.company { background: color-mix(in srgb, #3b82f6 18%, transparent);
  color: #60a5fa; border: 1px solid #3b82f680; }
.guest-type-badge.tour_operator { background: color-mix(in srgb, #22c55e 18%, transparent);
  color: #4ade80; border: 1px solid #22c55e80; }
.guest-type-badge.master { background: color-mix(in srgb, #eab308 18%, transparent);
  color: #facc15; border: 1px solid #eab30880; }

/* Detail-Panel */
.guest-detail-panel { width: 440px; flex-shrink: 0; border-left: 2px solid var(--border);
  display: flex; flex-direction: column; overflow: hidden; background: var(--surface2); }
.guest-detail-panel.hidden { display: none; }
.gdp-header { padding: 16px 20px 12px; border-bottom: 1px solid var(--border);
  display: flex; gap: 12px; align-items: flex-start; flex-shrink: 0; }
.gdp-avatar { width: 48px; height: 48px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 18px;
  font-weight: 700; background: color-mix(in srgb, var(--accent) 20%, transparent);
  color: var(--accent); }
.gdp-info { flex: 1; min-width: 0; }
.gdp-name { font-weight: 700; font-size: 16px; display: flex; align-items: center; gap: 6px; }
.gdp-contact { font-size: 11px; color: var(--text2); margin-top: 2px; }
.gdp-close { background: none; border: none; font-size: 18px; color: var(--text2);
  cursor: pointer; padding: 4px; }
.gdp-close:hover { color: var(--text); }
.gdp-tabs { display: flex; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.gdp-tab { padding: 8px 16px; font-size: 12px; font-weight: 600; color: var(--text2);
  background: none; border: none; border-bottom: 2px solid transparent;
  cursor: pointer; transition: all .15s; }
.gdp-tab.active { color: var(--accent); border-bottom-color: var(--accent); }
.gdp-tab:hover { color: var(--text); }
.gdp-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
.gdp-toolbar { display: flex; gap: 8px; padding: 12px 20px; border-top: 1px solid var(--border);
  flex-shrink: 0; flex-wrap: wrap; }
.gdp-toolbar .btn-primary { flex: 1; }
.gdp-toolbar .btn-sm { font-size: 11px; }

/* Profil-Formular im Detail-Panel */
.gdp-form { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.gdp-form label { font-size: 11px; font-weight: 600; color: var(--text2);
  text-transform: uppercase; letter-spacing: .3px; }
.gdp-form input:not([type="checkbox"]), .gdp-form select, .gdp-form textarea { width: 100%; padding: 7px 10px;
  background: var(--surface); border: 1px solid var(--border); border-radius: 6px;
  color: var(--text); font-size: 13px; }
.gdp-form input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--accent); cursor: pointer; }
.gdp-form textarea { resize: vertical; min-height: 50px; }
.gdp-form .span2 { grid-column: span 2; }
.gdp-form .company-row { grid-column: span 2; display: none; }
.gdp-form .company-row.show { display: block; }
.gdp-section-title { font-size: 11px; font-weight: 700; color: var(--accent);
  text-transform: uppercase; letter-spacing: .5px; margin: 10px 0 4px; grid-column: span 2;
  border-top: 1px solid var(--border); padding-top: 10px; }

/* Aufenthalte/Rechnungen im Detail */
.gdp-stay-list, .gdp-inv-list { display: flex; flex-direction: column; gap: 8px; }
.gdp-stay-item, .gdp-inv-item { background: var(--surface); border: 1px solid var(--border);
  border-radius: 6px; padding: 10px 12px; font-size: 12px; }
.gdp-stay-item strong { font-size: 13px; }
.gdp-stay-meta { color: var(--text2); margin-top: 4px; }
.gdp-empty { text-align: center; color: var(--text2); font-size: 13px; padding: 30px 10px; }

/* ── Mail/Dokumente Tab ─────────────────────────────────── */
.gdp-doc-list { display: flex; flex-direction: column; gap: 8px; }
.gdp-doc-item {
  display: flex; gap: 10px; align-items: flex-start;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: 6px; padding: 10px 12px; font-size: 12px;
}
.gdp-doc-icon { font-size: 18px; flex-shrink: 0; width: 24px; text-align: center; margin-top: 2px; }
.gdp-doc-body { flex: 1; min-width: 0; }
.gdp-doc-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 3px; }
.gdp-doc-label { font-weight: 600; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gdp-doc-recipient { font-size: 11px; color: var(--text2); margin-top: 2px; }
.gdp-doc-user { font-size: 11px; color: var(--text3); margin-top: 4px; }
.gdp-doc-time { margin-left: auto; font-size: 10px; color: var(--text3); white-space: nowrap; flex-shrink: 0; }
.gdp-doc-badge {
  display: inline-block; padding: 2px 7px; border-radius: 10px;
  font-size: 10px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .3px; white-space: nowrap; flex-shrink: 0;
}
.gdp-doc-badge--confirmation { background: color-mix(in srgb, #22c55e 15%, transparent); color: #22c55e; border: 1px solid color-mix(in srgb, #22c55e 35%, transparent); }
.gdp-doc-badge--offer { background: color-mix(in srgb, #eab308 15%, transparent); color: #eab308; border: 1px solid color-mix(in srgb, #eab308 35%, transparent); }
.gdp-doc-badge--invoice { background: color-mix(in srgb, var(--accent) 15%, transparent); color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent); }
.gdp-doc-badge--meldeschein { background: color-mix(in srgb, #a855f7 15%, transparent); color: #a855f7; border: 1px solid color-mix(in srgb, #a855f7 35%, transparent); }
.gdp-doc-badge--arrivals, .gdp-doc-badge--departures, .gdp-doc-badge--other {
  background: var(--surface2); color: var(--text2); border: 1px solid var(--border);
}

/* ── Protokoll-Ansicht (Einstellungen) ──────────────────── */
.log-filters { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; margin-bottom: 14px; }
.log-filters .form-group { margin: 0; }
.log-filters label { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--text2); margin-bottom: 3px; display: block; }
.log-filters select, .log-filters input[type="date"] { font-size: 12px; padding: 6px 8px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); }
.log-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.log-table th { text-align: left; padding: 8px 10px; font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--text2); border-bottom: 2px solid var(--border); position: sticky; top: 0; background: var(--bg); z-index: 1; }
.log-table td { padding: 7px 10px; border-bottom: 1px solid var(--border); vertical-align: top; }
.log-table tr:hover td { background: color-mix(in srgb, var(--accent) 5%, transparent); }
.log-action-icon { margin-right: 4px; }
.log-load-more { text-align: center; padding: 12px; }

/* ── MailComposer Dialog ──────────────────────────────────── */
.mc-modal { max-width: 700px; width: 95vw; max-height: 90vh; display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.mc-header { display: flex; justify-content: space-between; align-items: center;
  padding: 16px 20px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.mc-header h2 { margin: 0; font-size: 16px; }
.mc-form { flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.mc-field label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .3px;
  color: var(--text2); display: block; margin-bottom: 3px; }
.mc-field input, .mc-field textarea { width: 100%; padding: 8px 10px; background: var(--surface);
  border: 1px solid var(--border); border-radius: var(--radius); color: var(--text); font-size: 13px;
  font-family: inherit; box-sizing: border-box; }
.mc-field textarea { resize: vertical; min-height: 80px; line-height: 1.5; }
.mc-preview-label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .3px;
  color: var(--text2); margin-bottom: -4px; }
.mc-preview { max-height: 300px; overflow-y: auto; border: 1px solid var(--border);
  border-radius: var(--radius); background: #fff; padding: 16px; font-size: 12px; color: #1e293b; }
.mc-attachment { display: flex; align-items: center; gap: 6px;
  background: color-mix(in srgb, var(--accent) 8%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent);
  border-radius: var(--radius); padding: 8px 12px; font-size: 12px; color: var(--accent); font-weight: 600; }
.mc-footer { display: flex; align-items: center; gap: 8px; padding: 14px 20px;
  border-top: 1px solid var(--border); flex-shrink: 0; }
.mc-status { flex: 1; font-size: 13px; min-height: 20px; }
.mc-sending { display: inline-block; animation: mc-spin 1s linear infinite; }
@keyframes mc-spin { to { transform: rotate(360deg); } }

/* ── EMAIL TEMPLATE ADMIN ───────────────────────────────── */
.eta-controls { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 18px; }
.eta-controls select { padding: 7px 10px; background: var(--surface2); border: 1px solid var(--border);
  border-radius: 6px; color: var(--text); font-size: 13px; min-width: 160px; }
.eta-editor { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 900px) { .eta-editor { grid-template-columns: 1fr; } }
.eta-edit-col, .eta-preview-col { display: flex; flex-direction: column; }
.eta-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .3px;
  color: var(--text2); margin-bottom: 4px; }
.eta-input { width: 100%; padding: 8px 10px; background: var(--surface); border: 1px solid var(--border);
  border-radius: 6px; color: var(--text); font-size: 13px; }
.eta-textarea { width: 100%; padding: 8px 10px; background: var(--surface); border: 1px solid var(--border);
  border-radius: 6px; color: var(--text); font-size: 12px; font-family: monospace; resize: vertical; line-height: 1.5; }
.eta-vars { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-top: 10px; }
.eta-var-label { font-size: 11px; color: var(--text2); margin-right: 4px; }
.eta-chip { padding: 3px 8px; font-size: 11px; background: color-mix(in srgb, var(--accent) 15%, transparent);
  color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
  border-radius: 12px; cursor: pointer; font-family: monospace; }
.eta-chip:hover { background: color-mix(in srgb, var(--accent) 25%, transparent); }
.eta-actions { display: flex; gap: 8px; align-items: center; margin-top: 14px; flex-wrap: wrap; }
.eta-preview { min-height: 300px; max-height: 500px; overflow-y: auto;
  border: 1px solid var(--border); border-radius: 8px; background: #fff; padding: 0; }
.eta-preview iframe { width: 100%; height: 400px; border: none; border-radius: 8px; }
/* Promo-Blöcke */
.eta-promo-card { display: flex; align-items: center; gap: 12px; padding: 12px 16px;
  background: var(--surface2); border: 1px solid var(--border); border-radius: 8px; margin-bottom: 8px; }
.eta-promo-card .eta-promo-name { flex: 1; font-weight: 600; font-size: 13px; }
.eta-promo-card .eta-promo-meta { font-size: 11px; color: var(--text2); }
.eta-promo-badge { padding: 2px 8px; font-size: 10px; background: var(--accent); color: #fff;
  border-radius: 10px; white-space: nowrap; }
.eta-promo-edit { border: 1px solid var(--border); border-radius: 8px; padding: 16px;
  background: var(--surface); margin-bottom: 12px; }
.eta-promo-edit label { display: block; font-size: 11px; font-weight: 600; color: var(--text2);
  margin-bottom: 4px; margin-top: 10px; text-transform: uppercase; }
.eta-promo-edit label:first-child { margin-top: 0; }
.eta-promo-edit input, .eta-promo-edit select, .eta-promo-edit textarea {
  width: 100%; padding: 7px 10px; background: var(--surface2); border: 1px solid var(--border);
  border-radius: 6px; color: var(--text); font-size: 12px; }
.eta-promo-edit textarea { min-height: 80px; font-family: monospace; resize: vertical; }

/* ── GÄSTEKARTE MODAL ───────────────────────────────────── */
.guest-card-modal { max-width: 700px; width: 95vw; max-height: 90vh;
  display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.gcm-header { display: flex; align-items: flex-start; gap: 14px;
  padding: 20px 24px 16px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.gcm-avatar { width: 52px; height: 52px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 20px;
  font-weight: 700; background: color-mix(in srgb, var(--accent) 20%, transparent);
  color: var(--accent); }
.gcm-title-block { flex: 1; min-width: 0; }
.gcm-contact-line { font-size: 12px; color: var(--text2); margin-top: 3px; }
.gcm-vip-badge { background: #fef3c7; color: #92400e; border: 1px solid #fcd34d;
  border-radius: 12px; padding: 2px 10px; font-size: 11px; font-weight: 700;
  white-space: nowrap; }
.gcm-stats-row { display: flex; gap: 0; border-bottom: 1px solid var(--border);
  flex-shrink: 0; }
.gcm-stat { flex: 1; text-align: center; padding: 12px 8px; border-right: 1px solid var(--border); }
.gcm-stat:last-child { border-right: none; }
.gcm-stat-value { font-family: 'DM Serif Display', serif; font-size: 20px; font-weight: 700; color: var(--accent); }
.gcm-stat-label { font-size: 11px; color: var(--text2); margin-top: 2px; }
.gcm-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.gcm-tab { flex: 1; padding: 10px; background: none; border: none;
  border-bottom: 3px solid transparent; cursor: pointer; font-size: 13px;
  color: var(--text2); transition: all .15s; }
.gcm-tab.active { color: var(--accent); border-bottom-color: var(--accent);
  font-weight: 600; }
.gcm-body { flex: 1; overflow-y: auto; }
.gcm-tab-panel { display: none; padding: 16px 24px; }
.gcm-tab-panel.active { display: block; }

/* Aufenthalte Timeline */
.stay-item { display: flex; gap: 14px; align-items: flex-start;
  padding: 12px 0; border-bottom: 1px solid var(--border); }
.stay-item:last-child { border-bottom: none; }
.stay-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--accent);
  flex-shrink: 0; margin-top: 5px; }
.stay-info { flex: 1; }
.stay-title { font-weight: 600; font-size: 13px; }
.stay-meta { font-size: 11px; color: var(--text2); margin-top: 2px; }
.stay-prop { font-size: 11px; background: var(--surface2);
  border: 1px solid var(--border); border-radius: 4px; padding: 1px 7px; }
.stay-status { font-size: 11px; padding: 2px 8px; border-radius: 10px;
  background: var(--surface2); }

/* Rechnungen in Karte */
.gcm-invoice-row { display: flex; align-items: center; gap: 12px;
  padding: 10px 0; border-bottom: 1px solid var(--border); cursor: pointer; }
.gcm-invoice-row:hover { color: var(--accent); }
.gcm-invoice-row:last-child { border-bottom: none; }
.gcm-inv-num { font-weight: 600; font-size: 13px; min-width: 90px; }
.gcm-inv-date { font-size: 12px; color: var(--text2); }
.gcm-inv-total { font-weight: 700; color: var(--accent); margin-left: auto; }
.gcm-inv-status { font-size: 11px; }

/* Profil-Grid */
.gcm-profile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* ── PRINT DIALOG ──────────────────────────────────────── */
.pd-modal { width: 540px; max-width: 96vw; }
.pd-layout { display: flex; gap: 16px; }
.pd-types { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.pd-right { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.pd-types-label { font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: var(--text2); margin-bottom: 4px; }
.pd-type-btn { display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  background: var(--surface2); border: 2px solid var(--border); border-radius: 8px;
  cursor: pointer; font-size: 13px; font-weight: 600; color: var(--text);
  transition: all .15s; text-align: left; }
.pd-type-btn:hover { border-color: var(--accent); background: var(--bg); }
.pd-type-btn.active { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }
.pd-type-icon { font-size: 20px; flex-shrink: 0; }
.pd-action-radio { display: flex; align-items: center; gap: 10px; padding: 10px 14px;
  background: var(--surface2); border: 1px solid var(--border); border-radius: 8px;
  cursor: pointer; font-size: 13px; font-weight: 500; color: var(--text);
  transition: background .15s; }
.pd-action-radio:hover { background: var(--border); }
.pd-action-radio input[type=radio] { accent-color: var(--accent); width: 16px; height: 16px; }
.pd-info { margin-top: 8px; padding: 10px 12px; background: var(--surface2);
  border-radius: 8px; font-size: 12px; color: var(--text2); min-height: 60px; line-height: 1.6; }

/* ── SETTINGS TAB ─────────────────────────────────────── */
.settings-wrap { padding: 24px; max-width: 1100px; width: 100%; box-sizing: border-box; }
.settings-header { margin-bottom: 24px; }
.settings-header h2 { font-family: 'DM Serif Display', serif; font-size: 20px; font-weight: 700; margin: 0 0 6px; }
.settings-hint { font-size: 13px; color: var(--text2); margin: 0; }
.settings-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(600px, 1fr)); gap: 20px; }
.settings-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 20px; }
.settings-card-title { font-size: 15px; font-weight: 700; margin-bottom: 16px;
  padding-bottom: 10px; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; gap: 8px; }
.settings-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; }
.settings-form-grid .span2 { grid-column: span 2; }
.settings-form-grid label { font-size: 11px; font-weight: 600; color: var(--text2);
  text-transform: uppercase; letter-spacing: .04em; margin-bottom: 3px; display: block; }
.settings-form-grid input, .settings-form-grid textarea {
  width: 100%; padding: 7px 10px; border: 1px solid var(--border);
  border-radius: 6px; background: var(--bg); color: var(--text); font-size: 13px; box-sizing: border-box; }
.settings-form-grid textarea { resize: vertical; min-height: 60px; font-family: inherit; }
.settings-form-grid input:focus, .settings-form-grid textarea:focus {
  outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 20%, transparent); }
.settings-save-row { margin-top: 14px; display: flex; justify-content: flex-end; gap: 8px; align-items: center; }
.settings-saved-msg { font-size: 12px; color: #22c55e; opacity: 0; transition: opacity .4s; }
.settings-saved-msg.visible { opacity: 1; }
.settings-upload-btn {
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  padding: 6px 12px; border-radius: 6px; font-size: 12px; font-weight: 600;
  background: var(--surface2); border: 1px solid var(--border); color: var(--text);
  transition: background .15s; width: fit-content;
}
.settings-upload-btn:hover { background: var(--accent); color: #fff; border-color: var(--accent); }

/* ── Admin-Tabellen (Zimmer/Tische-Verwaltung) ── */
.admin-section { margin-bottom: 24px; }
.admin-section-header { display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; background: var(--surface2); border: 1px solid var(--border);
  border-radius: var(--radius) var(--radius) 0 0; }
.admin-section-header h3 { font-size: 14px; margin: 0; }
.admin-table { width: 100%; border-collapse: collapse; border: 1px solid var(--border);
  border-top: none; border-radius: 0 0 var(--radius) var(--radius); overflow: hidden; font-size: 13px; }
.admin-table th { background: var(--surface); padding: 8px 10px; text-align: left;
  font-weight: 600; font-size: 11px; color: var(--text2); border-bottom: 1px solid var(--border); }
.admin-table td { padding: 7px 10px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.admin-table tr:last-child td { border-bottom: none; }
.admin-table tr:hover td { background: var(--row-hover); }
.admin-table .inactive-row td { opacity: .5; }
.admin-actions { display: flex; gap: 4px; }
.admin-actions button { background: none; border: 1px solid var(--border); border-radius: 4px;
  cursor: pointer; padding: 3px 7px; font-size: 12px; color: var(--text2); transition: all .15s; }
.admin-actions button:hover { background: var(--accent); color: #fff; border-color: var(--accent); }
.admin-actions button.del:hover { background: var(--red); border-color: var(--red); }
.btn-sm { padding: 5px 12px; font-size: 12px; font-weight: 600; border-radius: 6px;
  border: none; cursor: pointer; background: var(--accent); color: #fff; transition: opacity .15s; }
.btn-sm:hover { opacity: .85; }
.admin-toggle { width: 36px; height: 20px; border-radius: 10px; border: none;
  cursor: pointer; position: relative; transition: background .2s;
  background: var(--border); }
.admin-toggle.on { background: var(--green); }
.admin-toggle::after { content: ''; position: absolute; top: 2px; left: 2px;
  width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .2s; }
.admin-toggle.on::after { transform: translateX(16px); }
.admin-empty { padding: 20px; text-align: center; color: var(--text3); font-size: 13px;
  border: 1px solid var(--border); border-top: none; border-radius: 0 0 var(--radius) var(--radius); }

/* ── PRINT / PDF STYLES ─────────────────────────────────── */
@media print {
  body { background: #fff !important; }
  body > *:not(#invoicePrintArea) { display: none !important; }
  #invoicePrintArea { display: block !important; background: #fff !important; }
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  .list-print-body table { width: 100%; border-collapse: collapse; font-size: 11px; }
  .list-print-body th { background: #f1f5f9 !important; color: #1e293b !important; padding: 6px 8px; text-align: left; border-bottom: 2px solid #cbd5e1; }
  .list-print-body td { padding: 5px 8px; border-bottom: 1px solid #e2e8f0; }
  .list-print-body tr:nth-child(even) td { background: #f8fafc !important; }
  .list-print-body button, .list-print-body .toolbar-btn { display: none !important; }
}
#invoicePrintArea {
  display: none;
  font-family: 'Segoe UI', Arial, sans-serif;
  color: #1e293b;
  padding: 40px;
  max-width: 800px;
  margin: 0 auto;
}
.ipr-header { display: flex; justify-content: space-between;
  align-items: flex-start; margin-bottom: 32px; }
.ipr-logo { font-size: 22px; font-weight: 800; color: var(--accent); }
.ipr-company { font-size: 11px; color: #64748b; margin-top: 4px; line-height: 1.6; }
.ipr-meta { text-align: right; font-size: 12px; color: #475569; line-height: 1.7; }
.ipr-meta strong { color: #1e293b; }
.ipr-title { font-size: 20px; font-weight: 700; margin-bottom: 6px; }
.ipr-recipient { background: #f8fafc; border-left: 3px solid #2563eb;
  padding: 12px 16px; margin-bottom: 24px; font-size: 12px; line-height: 1.6; }
.ipr-table { width: 100%; border-collapse: collapse; margin-bottom: 20px;
  font-size: 12px; }
.ipr-table th { background: #1e3a8a; color: #fff; padding: 8px 12px;
  text-align: left; font-size: 11px; }
.ipr-table th.r { text-align: right; }
.ipr-table td { padding: 8px 12px; border-bottom: 1px solid #e2e8f0; }
.ipr-table td.r { text-align: right; }
.ipr-table tr:nth-child(even) td { background: #f8fafc; }
.ipr-totals { display: flex; flex-direction: column; align-items: flex-end;
  gap: 4px; font-size: 13px; margin-bottom: 24px; }
.ipr-total-row { display: flex; gap: 32px; }
.ipr-total-row.grand { font-weight: 700; font-size: 16px; color: #2563eb;
  border-top: 2px solid #2563eb; padding-top: 8px; margin-top: 4px; }
.ipr-tax-row { display: flex; gap: 32px; font-size: 11px; color: #64748b; }
.ipr-tax-row + .ipr-total-row.grand { margin-top: 8px; }
.ipr-notes { font-size: 11px; color: #64748b; border-top: 1px solid #e2e8f0;
  padding-top: 16px; margin-top: 16px; }
.ipr-payment-block { font-size: 11px; color: #475569; background: #f8fafc;
  border: 1px solid #e2e8f0; border-radius: 6px; padding: 8px 12px;
  margin-top: 12px; }
.ipr-footer { margin-top: 40px; font-size: 10px; color: #94a3b8;
  text-align: center; border-top: 1px solid #e2e8f0; padding-top: 12px; }

/* ── TSE (Technische Sicherheitseinrichtung) auf Rechnung ── */
.ipr-tse { margin-top: 16px; padding: 10px 12px; border: 1px solid #cbd5e1;
  border-radius: 6px; font-size: 9px; color: #475569; display: flex;
  gap: 12px; align-items: flex-start; background: #f8fafc; }
.ipr-tse-qr { flex-shrink: 0; }
.ipr-tse-qr svg { width: 80px; height: 80px; }
.ipr-tse-data { flex: 1; line-height: 1.6; }
.ipr-tse-data strong { color: #334155; }
.ipr-tse-label { display: inline-block; width: 100px; font-weight: 600; color: #64748b; }
.ipr-tse-title { font-size: 10px; font-weight: 700; color: #334155; margin-bottom: 4px; }

/* ── Lexware / DATEV Export ── */
.lx-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
  padding: 12px; background: var(--surface2); border-radius: 8px; margin-bottom: 12px; }
.lx-toolbar label { font-size: 12px; color: var(--text2); font-weight: 600; }
.lx-toolbar input[type="date"], .lx-toolbar select { font-size: 12px; padding: 4px 8px;
  border: 1px solid var(--border); border-radius: 4px; background: var(--surface); color: var(--text); }
.lx-toolbar .lx-radio { display: flex; gap: 12px; align-items: center; font-size: 12px; }
.lx-toolbar .lx-radio label { cursor: pointer; display: flex; align-items: center; gap: 3px; }
.lx-stats { font-size: 12px; color: var(--text2); padding: 8px 12px; background: var(--surface2);
  border-radius: 6px; margin-bottom: 12px; display: flex; gap: 16px; align-items: center; }
.lx-stats strong { color: var(--text); }
.lx-preview { max-height: 500px; overflow: auto; border: 1px solid var(--border);
  border-radius: 6px; margin-bottom: 12px; }
.lx-preview table { width: 100%; border-collapse: collapse; font-size: 11px; }
.lx-preview th { background: var(--surface2); position: sticky; top: 0; text-align: left;
  padding: 6px 8px; font-weight: 600; color: var(--text2); border-bottom: 2px solid var(--border); }
.lx-preview td { padding: 4px 8px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.lx-preview tr:hover td { background: var(--surface2); }
.lx-actions { display: flex; gap: 10px; }
.lx-actions button { padding: 8px 16px; border-radius: 6px; font-size: 13px; font-weight: 600;
  cursor: pointer; border: none; }
.lx-btn-download { background: var(--accent); color: #fff; }
.lx-btn-download:hover { filter: brightness(1.1); }
.lx-btn-email { background: var(--surface2); color: var(--text); border: 1px solid var(--border) !important; }
.lx-btn-email:hover { background: var(--surface3); }
.lx-empty { text-align: center; padding: 40px; color: var(--text2); font-size: 14px; }

/* ═══════════ LIGHT MODE EXTRAS ═══════════ */
/* Scrollbars */
:root[data-theme="light"] ::-webkit-scrollbar { width: 8px; height: 8px; }
:root[data-theme="light"] ::-webkit-scrollbar-track { background: var(--surface2); }
:root[data-theme="light"] ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
:root[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* Form Inputs im Light Mode */
:root[data-theme="light"] .form-group input,
:root[data-theme="light"] .form-group select,
:root[data-theme="light"] .form-group textarea,
:root[data-theme="light"] .field-wrap input {
  background: #ffffff;
  border-color: #cbd5e1;
  color: #1e293b;
}
:root[data-theme="light"] .form-group select option { background: #fff; color: #1e293b; }

/* res-bar hover im Light Mode: dunkeln statt aufhellen */
:root[data-theme="light"] .res-bar:hover { filter: brightness(.92); }

/* Topbar Schatten im Light Mode */
:root[data-theme="light"] .topbar { box-shadow: 0 1px 4px rgba(0,0,0,.08); }
:root[data-theme="light"] .toolbar { box-shadow: 0 1px 3px rgba(0,0,0,.06); }

/* Gantt-Header etwas stärker abheben */
:root[data-theme="light"] .gantt-header-row { box-shadow: 0 2px 4px rgba(0,0,0,.06); }

/* Balken-Schatten für mehr Tiefe */
:root[data-theme="light"] .res-bar,
:root[data-theme="light"] .rg-bar { box-shadow: 0 1px 3px rgba(0,0,0,.15); }

/* ═══ Document Section in Reservation Modals ═══ */
.doc-section { margin-top: 10px; border-top: 1px solid var(--border); padding-top: 8px; }
.doc-section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.doc-section-title { font-size: 13px; font-weight: 600; color: var(--text2); }
.doc-list { display: flex; flex-direction: column; gap: 4px; max-height: 180px; overflow-y: auto; }
.doc-item { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 6px;
  background: var(--surface2, rgba(255,255,255,.04)); font-size: 12px; cursor: pointer; transition: background .15s; }
.doc-item:hover { background: var(--border); }
.doc-item-icon { font-size: 16px; flex-shrink: 0; }
.doc-item-body { flex: 1; min-width: 0; }
.doc-item-name { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.doc-item-meta { font-size: 10px; color: var(--text3); margin-top: 1px; }
.doc-item-del { color: var(--red); background: none; border: none; font-size: 14px; cursor: pointer;
  opacity: 0; transition: opacity .15s; padding: 2px 4px; }
.doc-item:hover .doc-item-del { opacity: 1; }
.doc-qr-wrap { display: flex; align-items: center; gap: 12px; margin-top: 8px;
  padding: 10px; background: var(--surface2, rgba(255,255,255,.04)); border-radius: 8px; }
.doc-qr-text { font-size: 11px; color: var(--text2); line-height: 1.6; }
.doc-upload-btn { padding: 4px 10px; border-radius: 6px; border: 1px dashed var(--border);
  background: transparent; color: var(--accent); font-size: 12px; cursor: pointer; font-weight: 600; }
.doc-upload-btn:hover { border-color: var(--accent); background: rgba(201,169,110,.08); }

/* ── Room Overview Table (Visbook-Style) ── */
#bRoomOverviewBody { overflow: visible; }
.room-overview-table { width: 100%; font-size: 12px; border-collapse: collapse; table-layout: fixed; }
.room-overview-table th {
  text-align: left; padding: 6px 8px; font-size: 11px; font-weight: 600;
  color: var(--text3); text-transform: uppercase; letter-spacing: .3px;
  border-bottom: 2px solid var(--border); white-space: nowrap;
}
.room-overview-table td { padding: 5px 8px; border-bottom: 1px solid var(--border); vertical-align: top; }
.room-overview-table td.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.room-overview-table td.bold { font-weight: 600; }
/* Column widths */
.room-overview-table th:nth-child(1),
.room-overview-table td:nth-child(1) { width: 150px; }
.room-overview-table th:nth-child(3),
.room-overview-table td:nth-child(3),
.room-overview-table th:nth-child(4),
.room-overview-table td:nth-child(4) { width: 80px; }
.room-overview-table th:nth-child(6),
.room-overview-table td:nth-child(6),
.room-overview-table th:nth-child(9),
.room-overview-table td:nth-child(9) { width: 85px; }
.room-overview-table th:nth-child(7),
.room-overview-table td:nth-child(7),
.room-overview-table th:nth-child(8),
.room-overview-table td:nth-child(8) { width: 55px; }

.room-overview-room-row { background: var(--surface2, rgba(255,255,255,.04)); }
.room-overview-room-row:hover { background: var(--border); }
.room-overview-extra-row { color: var(--text2); }
.room-overview-extra-row:hover { background: rgba(201,169,110,.04); }
.room-overview-room-cell { position: relative; overflow: visible; }

/* Dropdown Button */
.room-overview-dropdown-btn {
  background: var(--accent); color: #fff; border: none; border-radius: 5px;
  padding: 4px 10px; font-size: 12px; font-weight: 600; cursor: pointer;
  white-space: nowrap; transition: opacity .15s;
}
.room-overview-dropdown-btn:hover { opacity: .85; }

/* Dropdown Menu — fixed position to escape modal overflow */
.room-overview-dropdown {
  display: none; position: fixed; z-index: 99999;
  min-width: 210px; background: var(--bg, #fff); border: 1px solid var(--border);
  border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.22);
  padding: 4px 0;
}
.room-overview-dropdown.open { display: block; }
.room-overview-dd-item {
  padding: 7px 14px; font-size: 13px; cursor: pointer;
  white-space: nowrap; transition: background .1s;
}
.room-overview-dd-item:hover { background: var(--accent-light, rgba(139,92,246,.08)); }
.room-overview-dd-danger { color: var(--red, #e74c3c); }
.room-overview-dd-danger:hover { background: rgba(231,76,60,.08); }
.doc-empty { font-size: 11px; color: var(--text3); padding: 4px; }

/* ═══ Textbausteine (Settings + Snippet-Picker) ═══ */
.tb-toolbar { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:16px; }
.tb-filter-row { display:flex; gap:8px; flex:1; min-width:200px; }
.tb-filter-row select, .tb-filter-row input { padding:6px 10px; border:1px solid var(--border); border-radius:6px;
  background:var(--bg); color:var(--text); font-size:12px; }
.tb-filter-row input { flex:1; }
.tb-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:12px; }
.tb-card { background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:14px;
  cursor:pointer; transition:border-color .15s, box-shadow .15s; position:relative; }
.tb-card:hover { border-color:var(--accent); box-shadow:0 2px 8px rgba(0,0,0,.12); }
.tb-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:8px; margin-bottom:6px; }
.tb-card-name { font-weight:600; font-size:13px; }
.tb-badge { display:inline-block; padding:2px 8px; border-radius:10px; font-size:10px; font-weight:600; }
.tb-badge-item { background:rgba(59,130,246,.15); color:#3b82f6; }
.tb-badge-footer { background:rgba(168,85,247,.15); color:#a855f7; }
.tb-card-text { font-size:12px; color:var(--text2); line-height:1.5; display:-webkit-box;
  -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.tb-card-meta { font-size:10px; color:var(--text3); margin-top:6px; display:flex; gap:8px; }
.tb-card-inactive { opacity:.5; }
.tb-card-actions { position:absolute; top:8px; right:8px; display:flex; gap:4px; opacity:0; transition:opacity .15s; }
.tb-card:hover .tb-card-actions { opacity:1; }
.tb-card-actions button { background:none; border:none; cursor:pointer; font-size:14px; padding:2px; }

/* Snippet Editor Modal */
.tb-editor-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.tb-editor-grid .form-group { margin-bottom:0; }
.tb-editor-full { grid-column:1/-1; }
.tb-item-defaults { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; padding:12px;
  background:var(--surface2,rgba(255,255,255,.04)); border-radius:8px; margin-top:4px; }
.tb-item-defaults label { font-size:10px; font-weight:600; color:var(--text2); display:block; margin-bottom:3px; }
.tb-item-defaults input, .tb-item-defaults select { width:100%; padding:5px 8px; border:1px solid var(--border);
  border-radius:5px; background:var(--bg); color:var(--text); font-size:12px; }
.tb-translations { margin-top:12px; border-top:1px solid var(--border); padding-top:10px; }
.tb-trans-row { display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.tb-trans-flag { font-size:16px; width:24px; text-align:center; }
.tb-trans-text { flex:1; font-size:12px; color:var(--text2); padding:6px 8px; background:var(--surface2,rgba(255,255,255,.04));
  border-radius:6px; min-height:20px; }
.tb-trans-btn { background:none; border:none; cursor:pointer; font-size:13px; padding:2px 4px; }
.tb-trans-btn:hover { transform:scale(1.2); }
.tb-trans-spinner { display:inline-block; width:14px; height:14px; border:2px solid var(--border);
  border-top-color:var(--accent); border-radius:50%; animation:spin .6s linear infinite; }

/* Snippet Picker Dropdown (für Invoice/PrintDialog) */
.snippet-picker-wrap { position:relative; display:inline-block; }
.snippet-picker-btn { padding:4px 10px; border-radius:6px; border:1px dashed var(--accent);
  background:transparent; color:var(--accent); font-size:12px; cursor:pointer; font-weight:600;
  transition:background .15s; }
.snippet-picker-btn:hover { background:rgba(201,169,110,.1); }
.snippet-picker-dd { position:absolute; top:100%; left:0; z-index:9999; min-width:300px; max-height:280px;
  overflow-y:auto; background:var(--surface); border:1px solid var(--border); border-radius:8px;
  box-shadow:0 8px 24px rgba(0,0,0,.25); display:none; }
.snippet-picker-dd.open { display:block; }
.snippet-picker-dd .sp-search { width:100%; padding:8px 10px; border:none; border-bottom:1px solid var(--border);
  background:transparent; color:var(--text); font-size:12px; outline:none; }
.snippet-picker-dd .sp-item { padding:8px 12px; cursor:pointer; font-size:12px; transition:background .1s;
  display:flex; justify-content:space-between; align-items:center; }
.snippet-picker-dd .sp-item:hover { background:var(--border); }
.snippet-picker-dd .sp-item-name { font-weight:500; }
.snippet-picker-dd .sp-item-badge { font-size:9px; padding:1px 6px; border-radius:8px;
  background:rgba(201,169,110,.15); color:var(--accent); }
.snippet-picker-dd .sp-empty { padding:16px; text-align:center; font-size:11px; color:var(--text3); }

/* ── Channel Manager – Verfügbarkeits-Cockpit ── */
.cm-toolbar { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-bottom:14px; }
.cm-toolbar select, .cm-toolbar button { padding:6px 12px; border:1px solid var(--border); border-radius:6px;
  background:var(--surface); font-size:12px; cursor:pointer; }
.cm-toolbar button:hover { background:var(--border); }
.cm-toolbar .cm-zoom-btn.active { background:var(--accent); color:#fff; border-color:var(--accent); }
.cm-toolbar .cm-date-info { font-size:12px; color:var(--text2); min-width:180px; text-align:center; }
.cm-wrap { flex:1; overflow:auto; border:1px solid var(--border); border-radius:8px; background:var(--surface); }
.cm-grid { display:flex; flex-direction:column; min-width:max-content; }
.cm-month-row { display:flex; position:sticky; top:0; z-index:11; background:var(--surface2); }
.cm-month-cell { padding:4px 0; text-align:center; font-size:10px; font-weight:600; color:var(--text2);
  border-bottom:1px solid var(--border); border-right:1px solid var(--border); }
.cm-day-row { display:flex; position:sticky; top:24px; z-index:10; background:var(--surface); }
.cm-day-cell { width:38px; min-width:38px; text-align:center; padding:3px 0; font-size:10px; color:var(--text2);
  border-bottom:2px solid var(--border); border-right:1px solid rgba(0,0,0,.04); }
.cm-day-cell .cm-day-name { font-size:9px; color:var(--text3); }
.cm-day-cell .cm-day-num { font-weight:600; }
.cm-day-cell.weekend { background:var(--weekend-overlay); }
.cm-day-cell.today { background:var(--today-overlay); }
.cm-sidebar { width:200px; min-width:200px; }
.cm-prop-header { display:flex; align-items:center; background:var(--surface2); border-bottom:1px solid var(--border);
  cursor:pointer; font-weight:600; font-size:13px; }
.cm-prop-header:hover { filter:brightness(0.95); }
.cm-prop-label { width:200px; min-width:200px; padding:6px 10px; display:flex; align-items:center; gap:6px; }
.cm-prop-arrow { transition:transform .2s; font-size:10px; }
.cm-prop-arrow.open { transform:rotate(90deg); }
.cm-prop-cells { display:flex; }
.cm-prop-cell { width:38px; min-width:38px; text-align:center; font-size:11px; font-weight:600; padding:5px 0;
  border-right:1px solid rgba(0,0,0,.04); }
.cm-row { display:flex; border-bottom:1px solid rgba(0,0,0,.04); }
.cm-row:hover { background:var(--row-hover); }
.cm-row.cm-total-row { background:var(--surface2); border-bottom:1px solid var(--border); }
.cm-label { width:200px; min-width:200px; padding:5px 10px 5px 24px; font-size:12px; color:var(--text1);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cm-total-row .cm-label { font-weight:600; padding-left:10px; }
.cm-cells { display:flex; }
.cm-cell { width:38px; min-width:38px; text-align:center; font-size:11px; padding:5px 0;
  border-right:1px solid rgba(0,0,0,.04); cursor:default; }
.cm-cell.full { background:rgba(239,68,68,.15); color:#dc2626; font-weight:600; }
.cm-cell.low { background:rgba(234,179,8,.12); color:#a16207; }
.cm-cell.ok { background:rgba(34,197,94,.08); color:#16a34a; }
.cm-total-row .cm-cell { font-weight:600; }
.cm-row.expandable { cursor:pointer; }
.cm-row.expandable:hover { background:rgba(37,99,235,.06); }
.cm-row.expandable .cm-label::before { content:'▸ '; font-size:9px; color:var(--text3); }
.cm-row.expanded { background:rgba(37,99,235,.08); }
.cm-row.expanded .cm-label::before { content:'▾ '; }
.cm-detail { padding:10px 10px 10px 24px; background:rgba(37,99,235,.03); border-bottom:1px solid var(--border); }
.cm-price-grid { border-collapse:collapse; font-size:12px; width:auto; }
.cm-price-grid th { padding:4px 8px; font-size:10px; font-weight:600; color:var(--text2);
  border-bottom:2px solid var(--border); text-align:center; }
.cm-price-grid td { padding:4px 6px; border-bottom:1px solid rgba(0,0,0,.05); vertical-align:middle; }
.cm-price-grid td:first-child { font-weight:500; white-space:nowrap; min-width:120px; }
.cm-price-input { width:60px; padding:3px 4px; border:1px solid var(--border); border-radius:4px;
  text-align:center; font-size:11px; background:var(--surface); }
.cm-price-input:focus { border-color:var(--accent); outline:none; box-shadow:0 0 0 2px rgba(201,169,110,.2); }
.cm-price-we { font-style:italic; opacity:.7; }
.cm-price-ref { font-size:9px; color:var(--text3); display:block; text-align:center; }
.cm-price-cell { text-align:center; }
.cm-season-dates { display:flex; gap:4px; align-items:center; }
.cm-season-dates input[type="date"] { font-size:10px; padding:2px 4px; border:1px solid var(--border);
  border-radius:4px; background:var(--surface); }
.cm-detail-actions { display:flex; gap:8px; margin-top:10px; align-items:center; }
.cm-detail-actions button { padding:5px 14px; border-radius:6px; border:1px solid var(--border);
  font-size:11px; cursor:pointer; }
.cm-detail-actions .cm-btn-save { background:var(--accent); color:#fff; border-color:var(--accent); font-weight:600; }
.cm-detail-actions .cm-btn-save:hover { filter:brightness(1.1); }
.cm-detail-actions .cm-btn-season { background:var(--surface); }
.cm-detail-actions .cm-btn-season:hover { background:var(--border); }
.cm-detail-actions .cm-saved-msg { font-size:11px; color:#16a34a; display:none; }
/* ── Mobile Topbar ──────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════
   RESPONSIVE – TABLET (≤ 768px)
═══════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  /* ── Topbar ── */
  .topbar { height: auto; min-height: 44px; padding: 6px 8px; gap: 4px; flex-wrap: wrap; }
  .topbar h1 { font-size: 13px; margin-right: 0; }
  .tab-scroll-wrap { order: 2; flex-basis: 100%; min-height: 30px; }
  .topbar-right { order: 1; flex-wrap: wrap; gap: 3px; justify-content: flex-end; flex: 1; }
  .topbar-right .icon-btn { padding: 3px 5px; font-size: 10px; }
  .topbar-right .date-display { font-size: 10px; }
  .topbar-right .kbd, .tab-btn .kbd { display: none; }
  .tab-btn { padding: 4px 8px; font-size: 11px; }
  /* ── Toolbar ── */
  .toolbar { padding: 6px 8px; gap: 6px; flex-wrap: wrap; }
  .toolbar .toolbar-btn { font-size: 11px; padding: 3px 6px; }
  .zoom-wrap { gap: 4px; }
  #zoomSlider { width: 60px; }
  /* ── Modals ── */
  .modal { width: 95vw !important; max-height: 90vh; padding: 16px !important; }
  .modal-booking { width: 95vw !important; padding: 14px 16px 12px !important; }
  .modal-booking.fullscreen { width: 98vw !important; height: 95vh !important; padding: 16px 20px !important; }
  .modal-invoice { padding: 14px 16px !important; }
  /* ── Dashboard ── */
  .dashboard-banner { padding: 6px 8px; gap: 6px; }
  .db-card { padding: 5px 10px; min-width: 0; }
  .db-card .db-val { font-size: 13px; }
  .db-card .db-label { font-size: 10px; }
  .db-list-table th, .db-list-table td { padding: 6px 6px; font-size: 11px; }
  /* ── Gantt (Hotel) ── */
  .gantt-grid { font-size: 11px; }
  .gantt-sidebar-cell, .gantt-label { width: 110px; min-width: 110px; }
  .gantt-label .room-num { font-size: 12px; }
  .gantt-label .room-name { font-size: 10px; }
  .property-label { width: 110px; min-width: 110px; }
  /* ── Restaurant Gantt ── */
  .rg-sidebar-cell, .rg-label, .rg-property-label { width: 110px; min-width: 80px; }
  .rw-sidebar-cell, .rw-label { width: 110px; min-width: 80px; }
  /* ── Calendar/Preise ── */
  .cm-sidebar, .cm-prop-label, .cm-label { width: 140px; min-width: 100px; }
  /* ── Settings ── */
  .settings-wrap { padding: 12px; }
  .settings-page { padding: 10px; }
  .settings-card { padding: 14px; }
  .snav-btn { font-size: 11px; padding: 6px 10px; }
  /* ── Stats ── */
  .stats-kpis { grid-template-columns: repeat(2, 1fr); }
  /* ── Guests ── */
  .guests-header { flex-wrap: wrap; gap: 8px; }
  .guests-search-box { min-width: 180px; }
  .guest-cards-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important; }
  /* Gäste-Panel als Overlay auf Tablet */
  .guests-content { position: relative; }
  .guest-detail-panel { width: 360px; }
  .guest-table { font-size: 12px; }
  .guest-table th, .guest-table td { padding: 6px 8px; }
  /* ── Forms ── */
  .form-grid-3 { grid-template-columns: 1fr 1fr !important; gap: 8px; }
  .form-group label { font-size: 11px; }
  .form-group input, .form-group select, .form-group textarea { font-size: 13px; padding: 7px 10px; }
  /* ── Invoice ── */
  .inv-header-grid { grid-template-columns: 1fr 1fr !important; gap: 8px; }
  /* ── Shift Close ── */
  .shift-close-modal { max-width: 95vw; }
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE – PHONE (≤ 480px)
═══════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
  /* ── Topbar ── */
  .topbar { padding: 4px 6px; }
  .topbar h1 { font-size: 12px; }
  .topbar-right { gap: 2px; }
  #shiftCloseBtn, #dateDisplay { display: none; }
  .tab-btn { padding: 3px 6px; font-size: 10px; }
  /* ── Toolbar ── */
  .toolbar { padding: 4px 6px; gap: 4px; }
  .toolbar .toolbar-btn { font-size: 10px; padding: 2px 5px; }
  .toolbar-sep { display: none; }
  .zoom-wrap { display: none; }
  .toolbar-date { font-size: 11px; padding: 3px 6px; }
  /* ── Dashboard ── */
  .dashboard-banner { flex-direction: column; gap: 4px; padding: 4px 6px; }
  .db-card { width: 100%; padding: 6px 10px; }
  .db-card .db-val { font-size: 16px; }
  .db-card .db-label { font-size: 9px; }
  /* ── Stats ── */
  .stats-kpis { grid-template-columns: 1fr; }
  .stats-wrap { padding: 10px !important; }
  /* ── Gantt (Hotel) ── */
  .gantt-sidebar-cell, .gantt-label { width: 80px; min-width: 80px; padding: 0 6px; }
  .gantt-label .room-num { font-size: 11px; }
  .gantt-label .room-name { display: none; }
  .gantt-row { height: 34px; }
  .property-label { width: 80px; min-width: 80px; }
  .property-label .ph-name { font-size: 11px; }
  .floor-header { font-size: 10px; height: 22px; }
  /* ── Restaurant Gantt ── */
  .rg-sidebar-cell, .rg-label, .rg-property-label { width: 80px; min-width: 70px; font-size: 10px; }
  .rw-sidebar-cell, .rw-label { width: 80px; min-width: 70px; font-size: 10px; }
  .rg-hour-cell, .rw-hour-cell { font-size: 9px; }
  /* ── Calendar/Preise ── */
  .cm-sidebar, .cm-prop-label, .cm-label { width: 100px; min-width: 80px; font-size: 10px; }
  .cm-day-cell { width: 30px; min-width: 30px; font-size: 9px; padding: 2px 0; }
  .cm-prop-cell, .cm-cell { width: 30px; min-width: 30px; font-size: 10px; }
  .cm-toolbar { flex-wrap: wrap; gap: 6px; }
  .cm-toolbar .cm-date-info { min-width: 140px; font-size: 11px; }
  /* ── Modals ── */
  .modal { padding: 12px !important; border-radius: 10px !important; }
  .modal-booking { padding: 10px 12px 10px !important; }
  .modal-booking.fullscreen { padding: 12px 14px !important; }
  .modal h3, .modal-booking h3 { font-size: 16px; }
  .modal-overlay .modal { max-height: 94vh; }
  /* ── Forms ── */
  .form-grid-3 { grid-template-columns: 1fr !important; gap: 6px; }
  .form-group input, .form-group select { padding: 6px 8px; font-size: 13px; min-height: 36px; }
  .field-wrap input { padding: 8px 36px 8px 10px; }
  /* ── Settings ── */
  .settings-wrap { padding: 8px; }
  .settings-card { padding: 10px; }
  .settings-card h3 { font-size: 14px; }
  #settingsSubnav { gap: 2px; flex-wrap: wrap; }
  .snav-btn { font-size: 10px; padding: 4px 8px; }
  /* ── Guests ── */
  .guests-header { padding: 8px; }
  .guests-search-box { min-width: 100%; }
  .guest-cards-grid { grid-template-columns: 1fr !important; gap: 8px; padding: 8px; }
  .guest-card { padding: 10px; }
  .guest-card-name { font-size: 13px; }
  .guest-card-info span { font-size: 11px; }
  /* ── Guest Detail Panel: Full-Width Overlay auf Phone ── */
  .guest-detail-panel { position: absolute; inset: 0; width: 100% !important; z-index: 5;
    background: var(--bg); border-left: none !important; }
  .guests-content { position: relative; }
  .guest-table { font-size: 11px; }
  .guest-table th, .guest-table td { padding: 5px 6px; white-space: nowrap; }
  .guest-table-wrap { overflow-x: auto; }
  .gdp-header { flex-direction: column; align-items: flex-start; gap: 8px; }
  .gdp-info h3 { font-size: 16px; }
  /* ── Guest Card Modal ── */
  .gcm-tabs { flex-wrap: wrap; gap: 4px; }
  .gcm-tab { font-size: 11px; padding: 6px 10px; }
  .gcm-tab-panel { padding: 10px 12px; }
  /* ── Invoices ── */
  .inv-header-grid { grid-template-columns: 1fr !important; }
  .inv-row { flex-wrap: wrap; gap: 4px; padding: 8px; }
  .inv-num { min-width: auto; font-size: 12px; }
  .inv-date { min-width: auto; }
  .inv-total { min-width: auto; }
  .modal-invoice { padding: 10px 12px !important; }
  .inv-items-table { font-size: 11px; }
  .inv-items-table th, .inv-items-table td { padding: 4px 4px; }
  /* ── Housekeeping ── */
  .hk-grid { grid-template-columns: 1fr !important; }
  .hk-header { flex-direction: column; align-items: stretch; gap: 6px; }
  /* ── Booking Form inline styles ── */
  .tb-filter-row { min-width: 100% !important; flex-wrap: wrap; }
  /* ── Login ── */
  .login-box { width: 90vw; padding: 24px 20px; }
  .login-box h1 { font-size: 22px; }
  /* ── Toast ── */
  .toast-container { top: 10px; right: 10px; left: 10px; }
  .toast { min-width: auto; max-width: 100%; font-size: 12px; }
  /* ── Lists Menu ── */
  .lists-menu-grid { grid-template-columns: 1fr !important; }
  /* ── Dynamic Pricing Grid (7→4 Spalten) ── */
  #dynPricingGrid { grid-template-columns: repeat(4, 1fr) !important; }
  /* ── Zeiten Grid ── */
  #zeitenGrid { grid-template-columns: 1fr !important; }
  /* ── Booking form grid 2-col → 1-col ── */
  .form-grid { grid-template-columns: 1fr !important; }
}

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE – SMALL PHONE (≤ 375px)
═══════════════════════════════════════════════════════════ */
@media (max-width: 375px) {
  .topbar h1 { font-size: 11px; }
  .tab-btn { font-size: 9px; padding: 3px 5px; }
  .db-card .db-val { font-size: 14px; }
  .gantt-sidebar-cell, .gantt-label { width: 70px; min-width: 70px; }
  .gantt-label .room-num { font-size: 10px; }
  .cm-sidebar, .cm-prop-label, .cm-label { width: 80px; min-width: 70px; font-size: 9px; }
  .cm-day-cell, .cm-prop-cell, .cm-cell { width: 26px; min-width: 26px; }
  .modal { padding: 10px !important; }
  .form-group label { font-size: 10px; }
  .settings-card h3 { font-size: 13px; }
}

/* ═══════════════════════════════════════════════════════════
   TOUCH-FRIENDLY – Minimum Tap Targets
═══════════════════════════════════════════════════════════ */
@media (pointer: coarse) {
  .tab-btn { min-height: 36px; display: inline-flex; align-items: center; }
  .toolbar-btn { min-height: 32px; }
  .icon-btn { min-height: 32px; min-width: 32px; display: inline-flex; align-items: center; justify-content: center; }
  .snav-btn { min-height: 36px; }
  .gantt-row { min-height: 38px; }
  .rg-bar, .rw-bar { min-height: 28px; }
  .form-group input, .form-group select, .form-group textarea { min-height: 40px; }
  .btn-primary, .btn-cancel { min-height: 44px; font-size: 15px; }
  .login-box .btn-primary { min-height: 48px; }
  /* Bessere Scroll-Hinweise */
  .gantt-wrap, .rg-wrap, .rw-wrap, .cm-grid { -webkit-overflow-scrolling: touch; }
  .gantt-wrap::-webkit-scrollbar, .rg-wrap::-webkit-scrollbar { height: 4px; }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE UX ENHANCEMENTS
═══════════════════════════════════════════════════════════ */
/* ── Tab-Bar Scroll-Fade (zeigt an, dass mehr Tabs vorhanden) ── */
@media (max-width: 768px) {
  .tab-scroll-wrap {
    mask-image: linear-gradient(to right, transparent 0, #000 8px, #000 calc(100% - 24px), transparent);
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 8px, #000 calc(100% - 24px), transparent);
    scroll-snap-type: x mandatory;
    scroll-padding: 0 16px;
  }
  .tab-scroll-wrap .tab-btn { scroll-snap-align: start; }
}

/* ── Booking-Modal: Full-Screen auf Phone ── */
@media (max-width: 480px) {
  .modal-booking {
    width: 100vw !important; height: 100vh !important;
    max-height: 100vh !important; border-radius: 0 !important;
    position: fixed; inset: 0; margin: 0;
  }
  .modal-booking .modal-body { padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 20px); }
  /* Close-Button oben rechts prominenter */
  .modal-booking .modal-close,
  .modal-booking [onclick*="close"] { font-size: 24px !important; min-width: 44px; min-height: 44px; }
}

/* ── Gantt Scroll-Hinweis auf Mobile ── */
@media (max-width: 768px) {
  .gantt-wrap::after, .rg-wrap::after, .rw-wrap::after {
    content: ''; position: absolute; right: 0; top: 0; bottom: 0; width: 20px;
    background: linear-gradient(to left, var(--bg) 0%, transparent 100%);
    pointer-events: none; z-index: 2;
  }
  .gantt-wrap, .rg-wrap, .rw-wrap { position: relative; }
}

/* ── Bessere Lesbarkeit auf kleinen Screens ── */
@media (max-width: 480px) {
  /* Reservierungs-Bars größer */
  .gantt-bar { min-height: 28px; font-size: 10px; padding: 2px 6px;
    display: flex; align-items: center; border-radius: 4px; }
  /* Dashboard-Karten: Werte prominenter */
  .db-card { text-align: center; }
  .db-card .db-val { font-size: 18px; font-weight: 800; }
  /* Settings: Cards volle Breite */
  .settings-grid { grid-template-columns: 1fr !important; }
  /* Stats Charts Container */
  .stats-chart-wrap { overflow-x: auto; }
  /* Floating Action Button für neue Buchung */
  #fabNewBooking { display: flex !important; }
}

/* ── Floating Action Button (Neue Buchung) ── */
#fabNewBooking {
  display: none; /* nur auf Mobile via Media Query sichtbar */
  position: fixed; bottom: calc(env(safe-area-inset-bottom, 0px) + 16px); right: 16px;
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--accent); color: #000; border: none;
  font-size: 28px; font-weight: 300; box-shadow: 0 4px 12px rgba(0,0,0,.3);
  align-items: center; justify-content: center; z-index: 50;
  transition: transform .2s;
}
#fabNewBooking:active { transform: scale(.9); }

/* ── Pull-to-Refresh Indicator ── */
@media (pointer: coarse) {
  .gantt-wrap { scroll-behavior: smooth; }
  /* Scroll-Snap für Gantt (Tag-weise scrollen) */
  .gantt-body-scroll { scroll-snap-type: x proximity; }
}
/* ── LiveSync Toast ─────────────────────────────────────── */
#liveSyncToast {
  position:fixed; bottom:20px; left:50%; transform:translateX(-50%) translateY(100px);
  background:var(--burgundy,#6b1f2b); color:#fff; padding:8px 20px; border-radius:20px;
  font-size:13px; z-index:99999; opacity:0; transition:transform .3s,opacity .3s; pointer-events:none;
}
#liveSyncToast.visible { transform:translateX(-50%) translateY(0); opacity:1; }

/* ═══ TOAST NOTIFICATIONS ═══ */
.toast-container{position:fixed;top:20px;right:20px;z-index:999999;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.toast{pointer-events:auto;display:flex;align-items:flex-start;gap:10px;min-width:280px;max-width:420px;padding:12px 16px;
  border-radius:10px;font-size:13px;line-height:1.4;color:#fff;box-shadow:0 4px 20px rgba(0,0,0,.25);
  transform:translateX(120%);transition:transform .35s cubic-bezier(.22,1,.36,1),opacity .3s;opacity:0}
.toast.show{transform:translateX(0);opacity:1}
.toast.hide{transform:translateX(120%);opacity:0}
.toast-icon{font-size:18px;flex-shrink:0;margin-top:1px}
.toast-body{flex:1}
.toast-title{font-weight:700;font-size:13px;margin-bottom:2px}
.toast-msg{font-size:12px;opacity:.92}
.toast-close{background:none;border:none;color:rgba(255,255,255,.7);font-size:16px;cursor:pointer;padding:0 0 0 8px;flex-shrink:0}
.toast-close:hover{color:#fff}
.toast.toast-success{background:linear-gradient(135deg,#2d6a4f,#40916c)}
.toast.toast-error{background:linear-gradient(135deg,#9b1c31,#c0392b)}
.toast.toast-warning{background:linear-gradient(135deg,#b45309,#d97706)}
.toast.toast-info{background:linear-gradient(135deg,#1e40af,#3b82f6)}

/* ═══ DASHBOARD BANNER ═══ */
.dashboard-banner{display:flex;gap:10px;padding:8px 12px;background:var(--surface);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;flex-shrink:0}
.dashboard-banner:empty{display:none}
.db-card{display:flex;align-items:center;gap:8px;padding:6px 14px;border-radius:8px;font-size:12px;background:var(--surface2);border:1px solid var(--border)}
.db-card .db-icon{font-size:16px}
.db-card .db-val{font-weight:700;font-size:15px;color:var(--text)}
.db-card .db-label{color:var(--text2);font-size:11px}
.db-card.db-checkin{border-left:3px solid #2d6a4f}
.db-card.db-checkout{border-left:3px solid #A68A56}
.db-card.db-occupancy{border-left:3px solid #3b82f6}
.db-card.db-pending{border-left:3px solid #f59e0b}
.db-clickable{cursor:pointer;transition:transform .15s,box-shadow .15s}
.db-clickable:hover{transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,.1)}
.db-clickable:active{transform:translateY(0)}

.db-list-table{width:100%;border-collapse:collapse;font-size:13px}
.db-list-table th{text-align:left;padding:8px 10px;border-bottom:2px solid var(--border);font-size:11px;color:var(--text2);text-transform:uppercase;letter-spacing:.3px}
.db-list-table td{padding:8px 10px;border-bottom:1px solid var(--border);vertical-align:middle}
.db-list-table tr:hover{background:var(--surface2)}
.db-list-actions{white-space:nowrap;display:flex;gap:4px;align-items:center}
.db-list-btn{background:var(--surface2);border:1px solid var(--border);border-radius:6px;padding:4px 8px;font-size:12px;cursor:pointer;color:var(--text);transition:background .15s}
.db-list-btn:hover{background:var(--border)}
.db-list-btn-action{background:var(--accent);color:#fff;border-color:var(--accent);font-weight:600}
.db-list-btn-action:hover{opacity:.85}