/* Ergaenzungen zum Panino-Theme (nicht Teil der alten WordPress-Seite) */

/* Google-Karte: Platzhalter bis zur Zustimmung (2-Klick-Loesung statt Cookie-Banner) */
.map-consent {
	position: relative;
	width: 100%;
	height: 600px;
	max-width: 100%;
	margin-bottom: 28px; /* wie <p><iframe></p> im Original */
	background: #3b3330;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}
.map-consent-inner { padding: 30px; max-width: 520px; color: #fff; }
.map-consent-inner p { margin-bottom: 20px; }
.map-consent iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Startseite: Bild links / Text rechts (Felder intro_image, intro_text) */
.intro-bild-text {
	background-image: url(../img/74574.png);
	background-size: cover;
	background-position: center;
	padding: 60px 0 20px;
}
.intro-bild-text .fw-row { display: flex; flex-wrap: wrap; align-items: center; }
.intro-bild img { display: block; width: 100%; height: auto; }
.intro-text .TextBlock { padding: 10px 0; }
.intro-text .TextBlock > *:last-child { margin-bottom: 0; }
@media (max-width: 991px) {
	.intro-bild-text { padding: 30px 0 10px; }
	.intro-bild { margin-bottom: 25px; }
}

/* ------------------------------------------------------------------
   Mobile Darstellung (Ergaenzung 10/2026, Desktop bleibt unveraendert)
   ------------------------------------------------------------------ */

/* Lange Button-Texte ("Speisekarte Donnerstagabend II") duerfen umbrechen,
   sonst ragen sie bei 360 px und 1024 px aus der Spalte (seitliches Scrollen) */
.shortcode-button.btn { white-space: normal; max-width: 100%; }
.shortcode-button.btn span { white-space: normal; }

@media (max-width: 767px) {
	/* Lesbare Grundschrift statt 13 px */
	/* nur Fliesstext vergroessern – Ueberschriften haengen per em an body und bleiben wie sie sind */
	.TextBlock p, .TextBlock li, .fw-accordion-content p, .box-icon-subtitle { font-size: 15px; line-height: 1.65; }
	.food-menu-item-name { font-size: 16px; }
	.food-menu-item-description { font-size: 14px; line-height: 1.5; color: #666; }
	.mabel-bhi-businesshours td { font-size: 15px; padding: 6px 10px; }
	.mabel-bhi-businesshours { margin-bottom: 56px; }

	/* Menue-Knopf: Tippflaeche mind. 44 x 44 px */
	.slicknav_btn { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; }

	/* Buttons: volle Breite, gut antippbar */
	.shortcode-button.btn { display: block; width: 100%; padding: 15px 18px; }

	/* Kontakt: groesser, kraeftigerer Ton der Markenfarbe (Kontrast auf hellem Grund) */
	.BoxIcon .box-icon-title { font-size: 24px; line-height: 1.3; }
	.BoxIcon .box-icon-title a, .BoxIcon .box-icon-title font { color: #a86a38; }
	.BoxIcon .box-icon-title a { display: inline-block; padding: 6px 0; }

	/* Google-Karte: 600 px Hoehe ist auf dem Handy fast ein ganzer Bildschirm */
	.map-consent { height: 380px; }

	/* Galerie-Kacheln (2 Spalten auf dem Handy): Titel kleiner */
	.PortfolioGrid .portfolio-grid-item-title { font-size: 14px; left: 18px; bottom: 18px; max-width: calc(100% - 36px); }
	.PortfolioGrid a:hover .portfolio-grid-item-title { bottom: 18px; }
	.PortfolioGrid .item-has-border:before, .PortfolioGrid .item-has-border:after { top: 10px; right: 10px; bottom: 10px; left: 10px; }

	/* Footer-Links: groessere Tippflaechen */
	.FOOTER .copyright a { display: inline-block; padding: 10px 2px; }
	.FOOTER .copyright img { vertical-align: middle; }

	/* Datenschutz: lange URLs umbrechen (nur Links, sonst brechen auch Ueberschriften mitten im Wort) */
	.MAIN-CONTENT a { overflow-wrap: anywhere; }

}

@media (max-width: 400px) {
	/* Zierlinien neben Ueberschriften kuerzer, damit Woerter wie "Oeffnungszeiten" in eine Zeile passen */
	.SpecialHeading .special-title { padding-left: 30px; padding-right: 30px; }
	.SpecialHeading .special-title::before, .SpecialHeading .special-title::after { width: 20px; }
	.SpecialHeading.special-heading-h1 .special-title, .SpecialHeading.special-heading-h2 .special-title { font-size: 32px; }
	.SpecialHeading.special-heading-h3 .special-title { font-size: 26px; }
}
