/* Design für platza.php (TV Unna Tennis) – wird nach tv.css geladen */
:root {
  --gruen: #201069;
  --gruen-hell: #ebe9f7;
  --filz: #d9241b;
  --linie: #d0cde6;
  --text: #1a1340;
  --grund: #f8f7fc;
}
html { background: #e4e1f1; }
body.platza {
  max-width: 1024px; width: auto; height: auto; min-height: 100vh; margin: 0 auto;
  font-family: "Trebuchet MS", "Segoe UI", sans-serif;
  background: var(--grund); color: var(--text); line-height: 1.4;
  box-shadow: 0 0 0 1px var(--linie);
}
.platza * { box-sizing: border-box; }

/* Kopfbereich */
.platza header {
  background: var(--gruen); color: #fff; padding: 1.2rem 1rem;
  border-bottom: 6px solid var(--filz);
}
.platza header .kopf { color: inherit; text-decoration: none; display: flex; align-items: center; gap: 1rem; }
.platza header img { width: 64px; height: 64px; border-radius: 50%; background: #fff; flex: none; }
.platza header h1 { margin: 0; font-size: 1.6rem; letter-spacing: .02em; }
.platza header p { margin: .2rem 0 0; opacity: .85; }
.platza main { padding: 1rem 1rem 3rem; }

/* START / STORNO */
.platza nav.menue { display: flex; gap: .5rem; margin-bottom: 1rem; }
.platza .navbutton {
  flex: 1 1 0; max-width: 220px; margin: 0; padding: .7rem 1rem;
  font: inherit; font-weight: 700; font-size: 1rem; cursor: pointer;
  background: #fff; color: var(--gruen); border: 2px solid var(--gruen); border-radius: 999px;
}
.platza .navbutton:hover { background: var(--gruen); color: #fff; }
.platza button:focus-visible { outline: 3px solid var(--filz); outline-offset: 2px; }

/* Buchungstabelle */
.platza .plan-wrap { overflow-x: auto; touch-action: pan-x pan-y pinch-zoom; background: #fff; border: 1px solid var(--linie); border-radius: 10px; padding: .5rem; }
.platza table.plan {
  width: 100%; min-width: 760px; margin: 0; border: 0;
  border-collapse: separate; border-spacing: 0; font-size: .9rem;
}
.platza table.plan td { padding: .25rem .4rem; border: 0 !important; border-bottom: 1px solid var(--linie) !important; text-align: center; vertical-align: middle; }

/* Titel, Legende und Spaltenköpfe (alte Farbe #87CEFA) */
.platza table.plan td[colspan] { font-weight: 700; border-bottom: 0 !important; }
.platza table.plan td[colspan][bgcolor="#87CEFA"] { background: var(--gruen) !important; color: #fff; font-size: 1.05rem; padding: .7rem; border-radius: 8px 8px 0 0; }
.platza table.plan td[colspan][bgcolor="#ffffff"] { background: #fff !important; color: #55607a; font-weight: 400; font-size: .85rem; padding: .5rem; }
.platza table.plan td[bgcolor="#87CEFA"]:not([colspan]) { background: var(--gruen-hell) !important; color: var(--gruen); font-weight: 700; }

/* Datum-Zeilen: jeder Wochentag hat seine eigene Farbe (gleiche Reihenfolge wie bgcolor im PHP: Mo = #999999 … So = #F8F8FF) */
.platza table.plan td[bgcolor]:not([bgcolor="#87CEFA"]):not([bgcolor="#ffffff"]) { background: var(--grund) !important; color: var(--text); }
.platza table.plan.plan.plan td[bgcolor="#999999"] { background: #e3defa !important; }   /* Montag */
.platza table.plan.plan.plan td[bgcolor="#aaaaaa"] { background: #d6e8fb !important; }   /* Dienstag */
.platza table.plan.plan.plan td[bgcolor="#bbbbbb"] { background: #d4f1e2 !important; }   /* Mittwoch */
.platza table.plan.plan.plan td[bgcolor="#cccccc"] { background: #fdf0c8 !important; }   /* Donnerstag */
.platza table.plan.plan.plan td[bgcolor="#dddddd"] { background: #fbdccf !important; }   /* Freitag */
.platza table.plan.plan.plan td[bgcolor="#eeeeee"] { background: #f5d3ea !important; }   /* Samstag */
.platza table.plan.plan.plan td[bgcolor="#F8F8FF"] { background: #ffc9c9 !important; }   /* Sonntag */
.platza table.plan td[bgcolor]:not([bgcolor="#87CEFA"]):not([bgcolor="#ffffff"]):nth-child(2) { font-weight: 700; color: var(--gruen); }  /* Wochentag fett */

/* Trennlinie vor dem ersten Zeitfenster jedes Tages */
.platza table.plan td.tagbeginn, .platza table.plan td.tagbeginn ~ td { border-top: 3px solid var(--gruen) !important; }

/* Buchungsfelder */
.platza .wahlbutton, .platza .belegtbutton {
  display: inline-block; position: static; min-width: 2.6rem; margin: 0;
  padding: .35rem .6rem; font: inherit; font-weight: 700; font-size: .9rem;
  text-align: center; text-decoration: none; cursor: pointer; border-radius: 6px;
}
.platza .wahlbutton { background: #fff; color: var(--gruen); border: 1px solid var(--gruen); }       /* F = frei */
.platza .wahlbutton:hover { background: var(--gruen); color: #fff; }
.platza .belegtbutton { background: var(--filz); color: #fff; border: 1px solid var(--filz); }        /* T, M, E, D, L, S = belegt */
.platza .belegtbutton[onclick^="doStop"] { background: #eceef2; color: #8a90a0; border-color: #d5d9e3; } /* X = gesperrt */
.platza .belegtbutton:hover { filter: brightness(.92); }

@media (max-width: 600px) {
  .platza header h1 { font-size: 1.3rem; }
  .platza .navbutton { max-width: none; }
}