:root{
  --border:#111827;
  --grid:#9ca3af;
  --muted:#374151;
  --holiday:#dc2626;
  --bg:#ffffff;
}

body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);margin:0;}
.container{max-width:1200px;margin:0 auto;padding:16px;}

.header{
  border:2px solid var(--border);
  padding:14px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.title{
  font-size:46px;
  font-weight:900;
  letter-spacing:.5px;
  text-align:center;
  flex:1;
}
.nav{
  display:flex;
  gap:8px;
  align-items:center;
}
.nav a{
  display:inline-block;
  padding:8px 12px;
  border:2px solid var(--border);
  border-radius:10px;
  text-decoration:none;
  color:#111827;
  background:#fff;
  font-weight:700;
  white-space:nowrap;
}
.nav a.disabled{opacity:.45;pointer-events:none;}

.wrap{
  border:2px solid var(--border);
  border-top:none;
}
.two{
  display:grid;
  grid-template-columns:1fr 1fr;
}
.panel{
  border-right:2px solid var(--border);
}
.panel:last-child{border-right:none;}

table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
}
thead th{
  border-bottom:2px solid var(--border);
  padding:8px 6px;
  font-size:22px;
  font-weight:900;
}
thead th.small{
  width:46px;
}
thead th.wd{
  width:52px;
}
thead th.col{
  border-left:1px dotted var(--grid);
}
tbody td{
  border-top:1px dotted var(--grid);
  padding:6px 8px;
  vertical-align:middle;
  font-size:18px;
}
tbody td.num{
  width:46px;
  text-align:center;
  font-weight:900;
}
tbody td.wd{
  width:52px;
  font-weight:900;
  text-align:left;
  position:relative;
}
tbody td.saal, thead th.saal{width:50%;}
tbody td.sitz, thead th.sitz{width:50%;}
tbody td.saal, tbody td.sitz{
  border-left:1px dotted var(--grid);
}

.wd.sa{color:#2563eb;}
.wd.so{color:#dc2626;}

.holiday-mark{
  position:absolute;
  left:-2px;
  top:-1px;
  bottom:-1px;
  width:4px;
  background:var(--holiday);
}

.event{
  display:block;
  margin:2px 0;
  font-weight:400;
  line-height:1.15;
}
.event .dot{
  display:inline-block;
  width:10px;height:10px;border-radius:999px;
  margin-right:8px;
  vertical-align:middle;
}
.event .txt{vertical-align:middle;}
.note{
  margin-top:10px;
  font-size:12px;
  color:var(--muted);
}
.holiday-small{
  font-size:11px;
  font-weight:700;
  color:#dc2626;
  opacity:0.85;
  display:block;
  text-align:right;
  padding-right:4px;
}
.saal,
.sitz {
  font-family: "Arial Narrow", Arial, sans-serif;
}

/* =========================
   DRUCK / PDF (DIN A4 QUER)
   ========================= */

@page{
  size: A4 landscape;
  margin: 0;
}

@media print{
  .nav, .note{ display:none !important; }

  html, body{
    margin:0 !important;
    padding:0 !important;
    background:#fff !important;
  }

  /* Titel mittig */
  .title{
    text-align:center !important;
    width:100%;
  }

  /* Eine feste A4-Seite im Querformat */
  .container{
    width: 297mm;
    height: 210mm;
    box-sizing: border-box;
    padding: 8mm;            /* rundrum gleicher Rand */
    max-width: none !important;
    transform: none !important;
  }

  /* falls du vorher .wrap skaliert hast: abschalten */
  .wrap{ transform:none !important; }

  /* Umbruch verhindern */
  .header, .wrap, .two, .panel, table, tbody, tr{
    break-inside: avoid;
    page-break-inside: avoid;
  }
	@media print{
  /* Header wirklich symmetrisch machen */
  .header{
    display:block !important;
    text-align:center !important;
  }

  /* Nav ist schon versteckt, aber sicherheitshalber */
  .header .nav{ display:none !important; }

  /* Rechtes Platzhalter-DIV entfernen (das macht die Verschiebung) */
  .header > div:last-child{ display:none !important; }

  /* Titel volle Breite */
  .title{
    width:100% !important;
    text-align:center !important;
  }
}
