/* audatis Booking - gemeinsame Public-Styles
   Design abgeleitet aus details.php (Karten, audatis-Blau #007abb, gemutete Hinweise).
   Bewusst nur eng gefasste Klassen (.booking-*), damit nie global ins TYPO3-Theme
   eingegriffen wird. Eingebunden ueber assets/online_top.inc2.php. */

/* Karten-Container fuer Inhaltsbloecke */
.booking-card{
    border:1px solid #e3e7ea;
    border-radius:10px;
    background:#fbfcfd;
    padding:16px 18px;
    margin:0 0 16px;
}
.booking-card>h2:first-child,
.booking-card>h3:first-child,
.booking-card>h4:first-child{margin-top:0;}
.booking-card h3,.booking-card h4{color:#2d3d41;}

/* Formular-Tabelle (Anmelde-/Kontaktdaten, Teilnehmerdaten) */
table.booking-form{border-collapse:collapse;width:100%;background:transparent;border:0;}
.booking-form tr,.booking-form td{background:transparent;}
table.booking-form td{padding:9px 8px;vertical-align:middle;border:0;border-bottom:1px solid #eef1f3;}
table.booking-form tr:last-child td{border-bottom:0;}
.booking-form td.themen{color:#2d3d41;font-weight:600;width:38%;text-align:left;}
.booking-form input.form-text,
.booking-form input[type=text],
.booking-form input[type=email],
.booking-form select,
.booking-form textarea{
    width:100%;
    padding:9px 11px;
    border:1px solid #d8dee4;
    border-radius:5px;
    box-sizing:border-box;
    font-size:15px;
    background:#fff;
}
.booking-form input:focus,
.booking-form select:focus,
.booking-form textarea:focus{outline:none;border-color:#007abb;box-shadow:0 0 0 2px rgba(0,122,187,.12);}

/* Karten-Titel je Teilnehmer */
.booking-person{margin:0 0 6px;padding-bottom:8px;border-bottom:1px solid #e3e7ea;font-size:16px;color:#007abb;}

/* Preis-Zusammenfassung (Gesamtbetrag) */
.booking-summary{max-width:540px;margin:0 auto 18px;background:#f4f8fb;border:1px solid #e3e7ea;border-left:4px solid #007abb;border-radius:8px;padding:16px 20px;}
.booking-summary p{margin:5px 0;}
.booking-summary .booking-accent{font-size:18px;}

/* Feld + Knopf in einer Zeile (Gutscheincode anwenden). Das Feld liegt hier bewusst
   ausserhalb von table.booking-form - dort geht jedes Eingabefeld auf 100 % Breite,
   wodurch der Knopf mit Rand darunter rutschte. Auf schmalen Schirmen bricht die
   Zeile durch flex-wrap sauber um. */
.booking-inline{display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.booking-inline label{flex:0 0 auto;margin:0;color:#2d3d41;font-weight:600;}
.booking-inline input[type=text]{
    flex:1 1 200px;min-width:0;
    padding:9px 11px;border:1px solid #d8dee4;border-radius:5px;
    box-sizing:border-box;font-size:15px;background:#fff;
}
.booking-inline input[type=text]:focus{outline:none;border-color:#007abb;box-shadow:0 0 0 2px rgba(0,122,187,.12);}
.booking-inline .on-button{flex:0 0 auto;border:0;border-radius:5px;cursor:pointer;font-size:15px;line-height:1.25;padding:10px 18px;}

/* Gemutete Hinweise / Fussnoten */
.booking-muted{color:#6c757d;font-size:13px;}

/* Akzentfarbe (audatis-Blau) */
.booking-accent{color:#007abb;font-weight:700;}

/* Listen-Eintrag (Veranstaltungsuebersicht) - dezenter Akzentrand */
.booking-list-item{border-left:4px solid #007abb;}

/* Hinweis-Boxen (Erfolg/Fehler) - vereinheitlicht aus den Newsletter-Seiten */
.booking-note{padding:14px 16px;border-radius:6px;border:1px solid #e3e7ea;border-left:4px solid #007abb;background:#fbfcfd;margin:0 0 12px;}
.booking-note--ok{background:#eef7ec;border-color:#cfe6c8;border-left-color:#7da82a;}
.booking-note--err{background:#fdecea;border-color:#f5c6cb;border-left-color:#bc0e20;color:#bc0e20;}

/* ==== Header-Fixes (öffentliche Seiten) - 2026-07-03 ==================== */
/* Kontext: Der Public-Header ist ein statischer Spiegel des audatis.de-TYPO3-
   Headers. Zwei Layout-Defekte auf Desktop: (1) Nav-Eintrag "Über uns" brach
   auf zwei Zeilen um; (2) die Such-Lupe überlagerte den letzten Nav-Eintrag
   "ACADEMY". Fix eng auf den Header begrenzt. */
@media (min-width:1024px){
    /* (1) Nav-Einträge einzeilig halten. Top-Label ist teils <a>, teils
       <span class="on-no-page-link"> (nicht verlinkte Menüpunkte wie "Über uns"). */
    .header__main-menu ul.nav__menu > li.nav__item > a,
    .header__main-menu ul.nav__menu > li.nav__item > .on-no-page-link{ white-space:nowrap; }
    /* (2) Abstand zwischen den Hauptmenü-Einträgen verkleinern. Das Theme setzt
       margin-right:5rem (80px); zusammen mit dem breiteren Fallback-Font
       (Myriad Pro fehlt im Booking-Spiegel) lief die Menüreihe über ihre Box
       hinaus nach rechts unter die Such-Lupe. Kleinerer Abstand => passt in die
       Box, Lupe bleibt frei. */
    .header__main-menu ul.nav__menu > li.nav__item:not(:last-child){ margin-right:1.5rem; }
}

/* Die drei Umschalt-Buttons (audatis / MANAGER / SHOP) einheitlich auf
   audatis-Blau (#007abb) beim Hover - vorher blau/grün/rot. */
.audatis-switch .audatis-switch--link.first:hover,
.audatis-switch .audatis-switch--link.second:hover,
.audatis-switch .audatis-switch--link.third:hover{ background-color:#007abb; }
