/* Stil angelehnt an 55p.cz: hellgelber Hintergrund, Verdana, blaue Leiste,
   Kacheln mit runden Ecken, schlichte Tabelle mit schwarzen Linien. */

body {
  margin: 0;
  padding: 0 max(16px, 1.5%);   /* ein gemeinsamer Seitenrand für alles */
  background: #fff9ca;
  /* Sticky Footer: Fußzeile sitzt immer unten, auch bei wenig Inhalt */
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  font: 0.8em Verdana, Geneva, sans-serif;
  color: #000;
}

a, .asLink, .asButtonLink { color: blue; cursor: pointer; text-decoration: underline; }
a:hover, .asLink:hover, .asButtonLink:hover { color: red; }
.asButtonLink { font-weight: bold; }
.sede { color: #999; }

/* ---------- blaue Leiste ---------- */
div.pas {
  margin: 0.5em 0;
  background: #0c3a9a;
  text-align: center;
  padding: 0.5ex 0;
  font: 0.95em Arial, sans-serif;
  color: #fff;
}
div.pas a, div.pas .pasLink {
  display: inline-block;
  margin: 0 0.6em;
  padding: 0.1ex 0.1em;
  color: #fff;
  border: 0;
  border-bottom: thin solid #fff;
  text-decoration: none;
  background: none;
  font: inherit;
  cursor: pointer;
}
div.pas a:hover, div.pas .pasLink:hover { color: #28c8fd; border-bottom-color: #28c8fd; }
form.inline { display: inline; }

/* ---------- Überschriften ---------- */
h1 {
  font-family: Arial, sans-serif;
  text-align: center;
  font-size: 125%;
  margin: 0.4em 0 0.3em;
}
h1::first-line { font-size: 145%; }
h1 .untertitel { font-weight: normal; font-size: 80%; }
h2 {
  font-family: Verdana, sans-serif;
  font-size: 160%;
  margin: 1em 0 0.5em;
}
h2.tabellentitel { font-size: 120%; margin-bottom: 0.3em; }
h2.tabellentitel .sede { font-weight: normal; font-size: 80%; }

main { flex: 1 0 auto; }
footer { flex-shrink: 0; padding-bottom: 4.5em; /* Platz für den Sprachknopf */ }
hr { background: #000; margin: 2em 0 0; height: 3px; border: 0; }
p.fuss { text-align: center; font-style: italic; font-size: 0.95em; }
p.fuss .credits { font-style: normal; color: #444; }

/* ---------- Formulare ---------- */
label, span.label { width: 11em; display: inline-block; vertical-align: text-top; }
label.check { width: auto; margin-right: 1.2em; }
span.bis { display: inline-block; margin: 0 0.4em; }
input, select, textarea {
  margin: 0.3ex 0;
  padding: 0.25ex 0.4ex;
  border: thin solid #000;
  font: inherit;
  background: #fff;
}
input[type=checkbox] { vertical-align: middle; margin: 0 0.3em 0 0; }
input[type=button], input[type=submit], button {
  padding: 0.5ex 0.9ex;
  background: #efefef;
  cursor: pointer;
}
input[type=submit]:hover { background: #fff39f; }
input[type=submit].rot { color: #b00; }
input[type=date], input[type=text], input[type=password], select { width: 150px; }
select#zeit, select#veranstalter { width: auto; min-width: 150px; max-width: 100%; }
input.long, textarea { width: 550px; max-width: 95%; }
textarea { vertical-align: text-top; }
input[type=file] { border: 0; background: none; }
form.filter div, form.eingabe div { margin-bottom: 0.2ex; }
.zuruecksetzen { margin-left: 1em; }
.hinweis { color: #555; font-size: 0.9em; margin-left: 0.5em; }
.hinweis.nurtext { margin-left: 0; }
tr.nuradmin th, tr.nuradmin td { background: #fff3a0; }
p.hinweis { margin-left: 0; }

.vlozitNaStrance { width: 760px; max-width: 100%; }

/* ---------- Kacheln (wie „Jízdní řád“ auf 55p) ---------- */
nav.kacheln { display: flex; flex-wrap: wrap; gap: 8px; margin: 0.5em 0 1em; }
nav.kacheln a {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.5em;
  width: 175px;
  height: 64px;
  padding: 0 14px;
  box-sizing: border-box;
  background: #fffce3;
  border: thin solid #555;
  border-radius: 18px 18px 18px 18px / 18px 18px 18px 18px;
  color: #000;
  text-decoration: none;
  font: 1.35em Arial, sans-serif;
}
nav.kacheln a:hover { background: #fff39f; color: #000; }
nav.kacheln a.aktiv { background: #fff39f; border: 2px solid #0c3a9a; font-weight: bold; }
nav.kacheln a.neu { border-style: dashed; }
nav.kacheln .zahl {
  position: absolute; top: 5px; right: 8px;
  font: bold 0.55em Verdana, sans-serif;
  background: #0c3a9a; color: #fff;
  border-radius: 8px; padding: 1px 6px;
}

/* ---------- Tabelle ---------- */
div#forTable {
  overflow-x: auto;
  margin: 0;
  border: 3px solid #000;
  padding: 1ex;
  background: #fff;
  box-sizing: border-box;
}
table { border-collapse: collapse; margin: 1ex auto; cursor: default; }
table.termine { width: 100%; }
td, th {
  font: 1em Verdana, sans-serif;
  border: thin solid #000;
  padding: 0.4ex 1ex;
  text-align: center;
  white-space: nowrap;
}
th, td.datum { font-weight: bold; background: #d8d8d8; }
th a, th a:visited { color: #000; text-decoration: none; display: block; }
th a:hover { color: red; }
td.links { text-align: left; }
td.titel { white-space: normal; min-width: 18em; }
/* Desktop: Veranstalter & Ort brechen nur um, wenn die Tabelle sonst zu breit wuerde
   (auto-Tabellenlayout nutzt die volle Textbreite, solange Platz ist). Handy: weiter scrollen. */
@media (min-width: 601px) {
  td.umbruch { white-space: normal; min-width: 9em; }
}
a.stumm { color: #000; text-decoration: none; }
a.stumm:hover { color: red; text-decoration: underline; }

tr.sudy td:not(.datum) { background: #f7f7f7; }
tbody tr:hover td { background: #fff39f !important; }
tbody tr:hover td.datum { background: #0c3a9a !important; color: #fff; }
tr.dnes td.datum { background: #f8ad01; }
tr.vorbei td { color: #888; }
tr.vorbei td.datum { background: #e8e8e8; }

.kat { font-size: 0.95em; }
p.leer { text-align: center; padding: 2em; }
p.legende { margin: 0.6em 0; font-size: 0.9em; color: #444; }
.kastl { display: inline-block; width: 1em; height: 1em; vertical-align: middle; border: thin solid #000; }
.kastl.dnes { background: #f8ad01; }
.kastl.vorbei { background: #e8e8e8; }

/* ---------- Detail ---------- */
table.detail { margin: 0 0 1em; background: #fff; min-width: 50%; }
table.detail th { text-align: left; width: 9em; }
table.detail td { white-space: normal; }
.beschreibung {
  white-space: pre-line;
  background: #fff;
  border: thin solid #000;
  padding: 1ex 1.2ex;
  line-height: 150%;
}
.aktionen { display: flex; gap: 1.5em; align-items: center; }
.schluessel { background: #fff3a0; border: thin solid #000; padding: 0.5ex 1.2ex 1ex; }

/* ---------- Meldungen ---------- */
p.meldung { margin: 0.5em 0; padding: 0.6ex 1ex; border: thin solid #000; }
p.meldung.ok { background: #d9f5c8; }
p.meldung.fehler { background: #ffd2d2; color: #900; }

/* ---------- Handy ---------- */
@media (max-width: 600px) {
  body { font-size: 0.9em; }
  label, span.label { width: auto; display: block; }
  label.check { display: inline-block; }
  span.label:empty { display: none; }
  nav.kacheln a { width: calc(50% - 4px); height: 52px; font-size: 1.1em; }
  div#forTable { padding: 0.5ex; border-width: 2px; }
  input.long, textarea { width: 100%; box-sizing: border-box; }
}

/* ---------- Icons ---------- */
.icon { width: 1.15em; height: 1.15em; vertical-align: -0.2em; flex: none; }
.icon.klein { width: 0.9em; height: 0.9em; vertical-align: -0.1em; }
.icon.gross { width: 1.3em; height: 1.3em; }
nav.kacheln .icon { color: #0c3a9a; }
nav.kacheln a.aktiv .icon { color: #000; }
h2 .icon.gross { color: #0c3a9a; vertical-align: -0.15em; }
.icon.ok { color: #1a7f1a; }
td .kat .icon { color: #0c3a9a; }

/* ---------- Sprachauswahl (unten rechts) ---------- */
.lang { position: fixed; right: 16px; bottom: 16px; z-index: 10; }
.lang-btn {
  display: flex; align-items: center; gap: 0.35em;
  height: 40px; padding: 0 14px;
  border: 2px solid #fff; border-radius: 20px;
  background: #0c3a9a; color: #fff;
  font: bold 0.95em Arial, sans-serif;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}
.lang-btn:hover, .lang-btn[aria-expanded="true"] { background: #164fc4; }
.lang-popup {
  position: absolute; right: 0; bottom: 48px;
  min-width: 160px; padding: 4px;
  background: #fff; border: thin solid #000;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}
.lang-popup[hidden] { display: none; }
.lang-option {
  display: block; width: 100%; text-align: left;
  padding: 0.6ex 1ex; border: 0; background: none; cursor: pointer;
  font: 1em Verdana, sans-serif;
}
.lang-option:hover { background: #fff39f; }
.lang-option.aktiv { font-weight: bold; background: #d8d8d8; }
.lang-option .code { display: inline-block; width: 2.2em; color: #0c3a9a; font-weight: bold; }

/* ---------- Impressum ---------- */
.impressum h3 { font-size: 110%; margin: 1.2em 0 0.3em; }
.impressum p { line-height: 150%; margin-top: 0; }
.impressum .adresse { white-space: pre-line; }

/* ---------- Sitemap ---------- */
.sitemap h3 { font-size: 110%; margin: 1.2em 0 0.3em; }
.sitemap ul { line-height: 170%; padding-left: 1.4em; }
.sitemap-datum { display: inline-block; min-width: 13em; font-weight: bold; }