/* GardaseeMyLove Restaurantbereich: Design aus dem Elementor-Kit (post-522) und dem Portaldesign (portals.config.design).
   Wird nur auf den Restaurantseiten von GardaseeMyLove geladen (Muplugin tp-gardasee-restaurant-bereich.php).
   Farben: marke #009FE3, button #D81F84, button_hover #A91566, text #173247, text_gedaempft #526571,
   rahmen #D9E6ED, hintergrund #F2F8FB, karte #FFFFFF, link #006B99. Schrift: myMontserrat mit Montserrat-Ersatz. */
:root {
  --tp-accent: #D81F84;
  --tp-accent-deep: #A91566;
  --tp-ink: #173247;
  --tp-ink-soft: #2D4A5C;
  --tp-ink-muted: #526571;
  --tp-muted: #526571;
  --tp-line: #D9E6ED;
  --tp-soft: #F2F8FB;
  --tp-cream: #FFFFFF;
  --tp-green: #009FE3;
  --tp-serif: 'myMontserrat', 'Montserrat', Arial, sans-serif;
  --tp-r: 12px;
  --tp-r-s: 8px;
}
body .tp-place-list a, body .tp-place-list a:visited, body .tp-place-detail a { color: #006B99; }
body .tp-btn { background: #D81F84; border-color: #D81F84; color: #FFFFFF; min-height: 44px; }
body .tp-btn:hover { background: #A91566; border-color: #A91566; color: #FFFFFF; }
body .tp-btn:focus-visible { outline: 3px solid #D81F84; outline-offset: 2px; }
/* Quellenangabe der Karte (OpenStreetMap): Textlink mit Trefferflaeche 44 px. Die Angabe bleibt sichtbar. */
body .tp-lk-map__quelle a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 4px; }
/* Die Plugin-Tokens haengen am Container (.tp-place-list, .tp-loc): die Gardasee-Werte dort wiederholen. */
.tp-place-list,
.tp-loc,
.tp-place-detail {
  --tp-accent: #D81F84;
  --tp-accent-deep: #A91566;
  --tp-accent-ink: #FFFFFF;
  --tp-ink: #173247;
  --tp-ink-muted: #526571;
  --tp-muted: #526571;
  --tp-line: #D9E6ED;
  --tp-soft: #F2F8FB;
  --tp-surface-muted: #F2F8FB;
  --tp-cream: #FFFFFF;
  --tp-green: #009FE3;
  --tp-serif: 'myMontserrat', 'Montserrat', Arial, sans-serif;
  --tp-radius: 12px;
  --tp-r: 12px;
  --tp-r-s: 8px;
}
body .tp-empty { background: #F2F8FB; border-color: #D9E6ED; }
body .tp-empty .tp-btn { background: #D81F84; border-color: #D81F84; color: #FFFFFF; }

/* Zentrierung (11.10.2026): Restaurantuebersicht und Betriebsdetail ohne Sidebar (Seiteneinstellung Astra, sidebar-layout no-sidebar).
   Die Hauptspalte bekommt die volle Breite und wird mittig auf die Astra-Inhaltsbreite (1320 px) begrenzt.
   Seitlicher Abstand 16 px bis 32 px. Nur auf den beiden Seiten, kein Eingriff in andere Seiten oder Portale. */
body.page-id-22570 #primary.content-area,
body.page-id-22433 #primary.content-area,
body.tp-gm-unterkunftsuebersicht #primary.content-area {
  float: none !important;
  width: 100% !important;
  max-width: 1320px;
  margin-inline: auto !important;
  padding-inline: clamp(16px, 4vw, 32px) !important;
  box-sizing: border-box;
}
/* Der Off-Canvas-Menue-Bereich des Themes ragt auf schmalen Bildschirmen ueber den Rand; auf diesen Seiten wird er abgeschnitten. */
body.page-id-22570,
body.page-id-22433,
body.tp-gm-unterkunftsuebersicht {
  overflow-x: hidden;
}

/* Mobile Kopfzeile (320 px): die Reihe aus Logo und Menuebutton war 315,5 px breit, obwohl der Kopfbereich nur 300,8 px Innenbreite hat.
   Dadurch ragte der Menuebutton 5 px ueber den Rand. Nur auf diesen beiden Seiten; die globale Kopfzeile bleibt unveraendert. */
body.page-id-22570 .ast-mobile-header-wrap .ast-builder-grid-row,
body.page-id-22433 .ast-mobile-header-wrap .ast-builder-grid-row {
  width: 100% !important;
  max-width: 100%;
}

/* Ursache der Kopfzeilen-Breite: Logo (250 px) + Spaltenabstand (20 px) + Menuebutton (46 px) = 316 px; bei 320 px stehen nur 300,8 px zur Verfuegung.
   Auf schmalen Bildschirmen (bis 400 px) auf diesen beiden Seiten: Logo 220 px, Spaltenabstand 10 px. Summe 276 px. */
@media (max-width: 400px) {
  body.page-id-22570 .ast-mobile-header-wrap .ast-builder-grid-row,
  body.page-id-22433 .ast-mobile-header-wrap .ast-builder-grid-row {
    column-gap: 10px;
  }
  body.page-id-22570 .ast-mobile-header-wrap .custom-logo,
  body.page-id-22433 .ast-mobile-header-wrap .custom-logo {
    max-width: 220px;
    height: auto;
  }
}
