/*
 * Hettstedt Live – Notdienste
 * Mobile-first. Systemschrift (kein Font-Download, auch offline sofort lesbar).
 * Farben (Kontrast jeweils >= 4.5:1):
 *   Signalrot #b3261e  | Notfallblau #0b4a82 | Tinte #1b2230
 *   Fläche #f2f4f7     | Linie #cdd3dc       | Dienstgrün #0f6b34 auf #e2f3e8
 *   Warnbraun #6b4200 auf #fdf1d6
 * Alle Selektoren hängen an #hlnd-wrapper (Shortcode-Seite) bzw. #hlnd-panel-body (Fenster),
 * damit das Kadence-Theme nicht dazwischenfunkt. Die Doppelung ist gewollt.
 */

/* PWA-only: standardmäßig aus, nur im Standalone-Modus (hettstedt-live-pwa) oder Admin-Vorschau an. */
#hlnd-wrapper.hlnd--gate {
	display: none !important;
}
html.hlpwa-standalone #hlnd-wrapper.hlnd--gate,
#hlnd-wrapper.hlnd--gate.hlnd--force {
	display: block !important;
}

#hlnd-wrapper,
#hlnd-panel-body {
	box-sizing: border-box !important;
	max-width: 720px !important;
	margin: 0 auto !important;
	padding: 12px 12px 28px !important;
	color: #1b2230;
	font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	-webkit-text-size-adjust: 100%;
}
#hlnd-wrapper *,
#hlnd-panel-body *,
#hlnd-wrapper *::before,
#hlnd-panel-body *::before,
#hlnd-wrapper *::after,
#hlnd-panel-body *::after {
	box-sizing: border-box;
}

#hlnd-wrapper .hlnd-h,
#hlnd-panel-body .hlnd-h {
	margin: 4px 0 2px !important;
	font-size: 1.6rem !important;
	line-height: 1.2 !important;
	color: #1b2230 !important;
}
#hlnd-wrapper .hlnd-sub,
#hlnd-panel-body .hlnd-sub {
	margin: 0 0 14px !important;
	color: #3c4658;
}

/* Notruf-Bereich: das einzige laute Element der Seite. */
#hlnd-wrapper .hlnd-emerg,
#hlnd-panel-body .hlnd-emerg {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: 10px;
	margin: 0 0 16px !important;
}
#hlnd-wrapper a.hlnd-emerg__btn,
#hlnd-panel-body a.hlnd-emerg__btn {
	display: flex !important;
	flex-direction: column;
	gap: 2px;
	min-height: 48px;
	padding: 14px 16px !important;
	border-radius: 14px;
	color: #fff !important;
	text-decoration: none !important;
}
#hlnd-wrapper a.hlnd-emerg__btn--112,
#hlnd-panel-body a.hlnd-emerg__btn--112 {
	background: #b3261e !important;
}
#hlnd-wrapper a.hlnd-emerg__btn--116117,
#hlnd-panel-body a.hlnd-emerg__btn--116117 {
	background: #0b4a82 !important;
}
#hlnd-wrapper .hlnd-emerg__num,
#hlnd-panel-body .hlnd-emerg__num {
	font-size: 2.4rem;
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: 0.01em;
}
#hlnd-wrapper .hlnd-emerg__title,
#hlnd-panel-body .hlnd-emerg__title {
	font-size: 1.05rem;
	font-weight: 700;
}
#hlnd-wrapper .hlnd-emerg__sub,
#hlnd-panel-body .hlnd-emerg__sub {
	font-size: 0.95rem;
}
#hlnd-wrapper .hlnd-emerg__cta,
#hlnd-panel-body .hlnd-emerg__cta {
	margin-top: 8px;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Hinweiszeile für Live-Stand / Fehler */
#hlnd-wrapper .hlnd-live-note,
#hlnd-panel-body .hlnd-live-note {
	margin: 0 0 12px !important;
	font-size: 0.9rem;
	color: #3c4658;
}
#hlnd-wrapper .hlnd-live-note[hidden],
#hlnd-panel-body .hlnd-live-note[hidden] {
	display: none !important;
}
#hlnd-wrapper .hlnd-live-note--warn,
#hlnd-panel-body .hlnd-live-note--warn {
	padding: 10px 12px;
	border-left: 4px solid #6b4200;
	background: #fdf1d6;
	color: #6b4200;
	font-weight: 600;
}

/* Karten */
#hlnd-wrapper .hlnd-cards,
#hlnd-panel-body .hlnd-cards {
	display: grid;
	gap: 12px;
}
#hlnd-wrapper .hlnd-card,
#hlnd-panel-body .hlnd-card {
	padding: 14px 14px 12px;
	border: 1px solid #cdd3dc;
	border-radius: 8px;
	background: #fff;
}
#hlnd-wrapper .hlnd-card__title,
#hlnd-panel-body .hlnd-card__title {
	margin: 0 0 6px !important;
	font-size: 1.15rem !important;
	line-height: 1.3 !important;
	color: #1b2230 !important;
}
#hlnd-wrapper .hlnd-badge,
#hlnd-panel-body .hlnd-badge {
	display: inline-block;
	margin: 0 0 6px !important;
	padding: 3px 10px;
	border-left: 4px solid #3c4658;
	background: #f2f4f7;
	color: #1b2230;
	font-size: 0.95rem;
	font-weight: 700;
}
#hlnd-wrapper .hlnd-badge[data-state="active"],
#hlnd-panel-body .hlnd-badge[data-state="active"] {
	border-left-color: #0f6b34;
	background: #e2f3e8;
	color: #0f6b34;
}
#hlnd-wrapper .hlnd-badge[data-state="inactive"],
#hlnd-panel-body .hlnd-badge[data-state="inactive"] {
	border-left-color: #3c4658;
	background: #f2f4f7;
	color: #1b2230;
}
#hlnd-wrapper .hlnd-badge[data-state="unknown"],
#hlnd-panel-body .hlnd-badge[data-state="unknown"],
#hlnd-wrapper .hlnd-badge[data-state="loading"],
#hlnd-panel-body .hlnd-badge[data-state="loading"] {
	border-left-color: #6b4200;
	background: #fdf1d6;
	color: #6b4200;
}
#hlnd-wrapper .hlnd-badge[data-state="link"],
#hlnd-panel-body .hlnd-badge[data-state="link"],
#hlnd-wrapper .hlnd-badge[data-state="info"],
#hlnd-panel-body .hlnd-badge[data-state="info"],
#hlnd-wrapper .hlnd-badge[data-state="always"],
#hlnd-panel-body .hlnd-badge[data-state="always"] {
	border-left-color: #0b4a82;
	background: #e5eef7;
	color: #0b4a82;
}
#hlnd-wrapper .hlnd-area,
#hlnd-panel-body .hlnd-area {
	margin: 0 0 6px !important;
	color: #3c4658;
	font-size: 0.95rem;
}
#hlnd-wrapper .hlnd-lines,
#hlnd-panel-body .hlnd-lines {
	margin: 0 0 8px !important;
	padding-left: 1.1em !important;
	list-style: disc !important;
}
#hlnd-wrapper .hlnd-lines li,
#hlnd-panel-body .hlnd-lines li {
	margin: 0 0 4px !important;
	max-width: 62ch;
}
#hlnd-wrapper .hlnd-subs,
#hlnd-panel-body .hlnd-subs {
	display: grid;
	gap: 10px;
	margin: 8px 0 10px;
}
#hlnd-wrapper .hlnd-sub,
#hlnd-panel-body .hlnd-sub {
	padding: 10px 12px;
	border-radius: 6px;
	background: #f2f4f7;
}
#hlnd-wrapper .hlnd-sub__title,
#hlnd-panel-body .hlnd-sub__title {
	margin: 0 0 4px !important;
	font-size: 1rem !important;
	line-height: 1.3 !important;
	color: #1b2230 !important;
}
#hlnd-wrapper .hlnd-sub__addr,
#hlnd-panel-body .hlnd-sub__addr {
	margin: 0 0 6px !important;
	color: #3c4658;
	font-size: 0.95rem;
}
#hlnd-wrapper .hlnd-note,
#hlnd-panel-body .hlnd-note,
#hlnd-wrapper .hlnd-source,
#hlnd-panel-body .hlnd-source {
	margin: 8px 0 0 !important;
	color: #3c4658;
	font-size: 0.9rem;
}

/* Buttons: mind. 48 px hoch (Touch), Text statt nur Farbe/Icon */
#hlnd-wrapper .hlnd-actions,
#hlnd-panel-body .hlnd-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 8px 0 0;
}
#hlnd-wrapper a.hlnd-btn,
#hlnd-panel-body a.hlnd-btn {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	min-height: 48px;
	padding: 10px 16px !important;
	border: 2px solid #0b4a82;
	border-radius: 8px;
	background: #fff;
	color: #0b4a82 !important;
	font-weight: 700;
	text-decoration: none !important;
}
#hlnd-wrapper a.hlnd-btn--primary,
#hlnd-panel-body a.hlnd-btn--primary {
	background: #0b4a82 !important;
	color: #fff !important;
}
#hlnd-wrapper a.hlnd-btn--call.hlnd-btn--primary,
#hlnd-panel-body a.hlnd-btn--call.hlnd-btn--primary {
	background: #0b4a82 !important;
}

/* Sichtbarer Fokus */
#hlnd-wrapper a:focus-visible,
#hlnd-panel-body a:focus-visible {
	outline: 3px solid #1b2230;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px #ffbf47;
}

#hlnd-wrapper .hlnd-foot,
#hlnd-panel-body .hlnd-foot {
	margin-top: 18px;
	color: #3c4658;
	font-size: 0.9rem;
}
#hlnd-wrapper .hlnd-foot p,
#hlnd-panel-body .hlnd-foot p {
	margin: 0 0 4px !important;
}

/* Breitere Displays */
@media (min-width: 540px) {
	#hlnd-wrapper .hlnd-emerg,
#hlnd-panel-body .hlnd-emerg {
		grid-template-columns: 1fr 1fr;
	}
}

/* Google Auto Ads dürfen hier nie erscheinen (Notfall-UI). */
#hlnd-wrapper ins.adsbygoogle,
#hlnd-panel-body ins.adsbygoogle,
#hlnd-wrapper .google-auto-placed,
#hlnd-panel-body .google-auto-placed,
#hlnd-wrapper iframe[id^="aswift"],
#hlnd-panel-body iframe[id^="aswift"],
#hlnd-wrapper [data-ad-status],
#hlnd-panel-body [data-ad-status],
#hlnd-wrapper [data-google-query-id],
#hlnd-panel-body [data-google-query-id] {
	display: none !important;
}

@media (prefers-reduced-motion: reduce) {
	#hlnd-wrapper *,
#hlnd-panel-body * {
		transition: none !important;
		animation: none !important;
	}
}

/* ------------------------------------------------------------------
 * Hinweis für normale Browser auf der Shortcode-Seite
 * ------------------------------------------------------------------ */
#hlnd-appnote {
	box-sizing: border-box;
	max-width: 720px;
	margin: 16px auto;
	padding: 14px 16px;
	border-left: 4px solid #0b4a82;
	background: #e5eef7;
	color: #1b2230;
	font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
#hlnd-appnote[hidden] {
	display: none !important;
}
#hlnd-appnote .hlnd-appnote__t {
	margin: 0 0 6px !important;
	font-size: 1.15rem !important;
	line-height: 1.3 !important;
	color: #1b2230 !important;
}
#hlnd-appnote p {
	margin: 0 0 6px !important;
}

/* ------------------------------------------------------------------
 * Symbol am Bildrand (nur PWA)
 * Mit Abstand zum Rand, damit es nicht in die Zurück-Wischgeste von Android fällt.
 * ------------------------------------------------------------------ */
#hlnd-dock {
	display: none !important;
	position: fixed;
	top: 60%;
	z-index: 99990;
	margin: 0;
	padding: 0;
	transform: translateY(-50%);
}
html.hlpwa-standalone #hlnd-dock {
	display: block !important;
}
html.hlpwa-standalone #hlnd-dock[hidden] {
	display: none !important;
}
#hlnd-dock.hlnd-dock--left {
	left: max(14px, env(safe-area-inset-left));
}
#hlnd-dock.hlnd-dock--right {
	right: max(14px, env(safe-area-inset-right));
}
#hlnd-dock a.hlnd-dock__open {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border: 2px solid #fff;
	border-radius: 14px;
	background: #b3261e !important;
	box-shadow: 0 0 0 1px rgba(27, 34, 48, 0.35);
	text-decoration: none !important;
}
#hlnd-dock .hlnd-dock__icon {
	display: block;
	width: 28px;
	height: 28px;
}
#hlnd-dock button.hlnd-dock__hide {
	position: absolute;
	top: -12px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	min-height: 28px;
	margin: 0;
	padding: 0;
	border: 2px solid #fff;
	border-radius: 50%;
	background: #1b2230 !important;
	color: #fff !important;
	font: 700 16px/1 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	cursor: pointer;
}
#hlnd-dock.hlnd-dock--left button.hlnd-dock__hide {
	right: -12px;
}
#hlnd-dock.hlnd-dock--right button.hlnd-dock__hide {
	left: -12px;
}
#hlnd-dock a:focus-visible,
#hlnd-dock button:focus-visible,
#hlnd-panel button:focus-visible,
#hlnd-panel a:focus-visible {
	outline: 3px solid #1b2230;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px #ffbf47;
}

/* ------------------------------------------------------------------
 * Fenster (Vollbild auf dem Handy)
 * ------------------------------------------------------------------ */
#hlnd-panel {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	height: 100%;
	max-height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: #fff;
	color: #1b2230;
	overflow: hidden;
}
#hlnd-panel:not([open]) {
	display: none !important;
}
#hlnd-panel[open] {
	display: flex !important;
	flex-direction: column;
}
#hlnd-panel::backdrop {
	background: rgba(27, 34, 48, 0.55);
}
#hlnd-panel .hlnd-panel__bar {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: calc(8px + env(safe-area-inset-top)) 12px 8px;
	border-bottom: 1px solid #cdd3dc;
	background: #fff;
}
#hlnd-panel .hlnd-panel__title {
	margin: 0 !important;
	font: 700 1.25rem/1.2 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
	color: #1b2230 !important;
}
#hlnd-panel button.hlnd-panel__close {
	min-width: 48px;
	min-height: 48px;
	padding: 8px 14px;
	border: 2px solid #0b4a82;
	border-radius: 8px;
	background: #fff !important;
	color: #0b4a82 !important;
	font: 700 1rem/1.2 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	cursor: pointer;
}
#hlnd-panel .hlnd-panel__scroll {
	flex: 1 1 auto;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding-bottom: env(safe-area-inset-bottom);
}
#hlnd-panel-body .hlnd-loading {
	margin: 0;
	color: #3c4658;
}
html.hlnd-lock {
	overflow: hidden !important;
}
@media (min-width: 720px) {
	#hlnd-panel {
		width: min(720px, 94vw);
		height: min(92vh, 900px);
		margin: auto;
		border-radius: 14px;
	}
}

/* Google Auto Ads auch im Symbol und Fenster verhindern */
#hlnd-dock ins.adsbygoogle,
#hlnd-dock .google-auto-placed,
#hlnd-panel ins.adsbygoogle,
#hlnd-panel .google-auto-placed,
#hlnd-panel [data-ad-status] {
	display: none !important;
}

/* ------------------------------------------------------------------
 * Apotheken-Suche
 * ------------------------------------------------------------------ */
#hlnd-wrapper .hlnd-apo,
#hlnd-panel-body .hlnd-apo {
	margin: 10px 0 4px;
	padding: 10px 12px;
	border-radius: 6px;
	background: #f2f4f7;
}
#hlnd-wrapper .hlnd-apo__label,
#hlnd-panel-body .hlnd-apo__label {
	display: block;
	margin: 0 0 6px !important;
	font-weight: 700;
	color: #1b2230;
}
#hlnd-wrapper .hlnd-apo__input,
#hlnd-panel-body .hlnd-apo__input {
	display: block;
	width: 100% !important;
	min-height: 48px;
	margin: 4px 0 0 !important;
	padding: 8px 12px !important;
	border: 2px solid #3c4658 !important;
	border-radius: 8px !important;
	background: #fff !important;
	color: #1b2230 !important;
	font: 1rem/1.4 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
}
#hlnd-wrapper .hlnd-apo__input:focus-visible,
#hlnd-panel-body .hlnd-apo__input:focus-visible {
	outline: 3px solid #1b2230;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px #ffbf47;
}
#hlnd-wrapper .hlnd-apo__row,
#hlnd-panel-body .hlnd-apo__row {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 8px 0;
}
#hlnd-wrapper button.hlnd-btn,
#hlnd-panel-body button.hlnd-btn {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	min-height: 48px;
	padding: 10px 16px !important;
	border: 2px solid #0b4a82 !important;
	border-radius: 8px !important;
	background: #fff !important;
	color: #0b4a82 !important;
	font: 700 1rem/1.2 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
	cursor: pointer;
}
#hlnd-wrapper button.hlnd-btn--primary,
#hlnd-panel-body button.hlnd-btn--primary {
	background: #0b4a82 !important;
	color: #fff !important;
}
#hlnd-wrapper button.hlnd-btn:disabled,
#hlnd-panel-body button.hlnd-btn:disabled {
	opacity: 0.6;
	cursor: default;
}
#hlnd-wrapper button.hlnd-btn:focus-visible,
#hlnd-panel-body button.hlnd-btn:focus-visible,
#hlnd-wrapper .hlnd-apo__forget-btn:focus-visible,
#hlnd-panel-body .hlnd-apo__forget-btn:focus-visible {
	outline: 3px solid #1b2230;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px #ffbf47;
}
#hlnd-wrapper .hlnd-apo__remember,
#hlnd-panel-body .hlnd-apo__remember {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 32px;
	margin: 0 0 6px !important;
	color: #1b2230;
}
#hlnd-wrapper .hlnd-apo__remember input,
#hlnd-panel-body .hlnd-apo__remember input {
	width: 20px;
	height: 20px;
	margin: 0 !important;
}
#hlnd-wrapper .hlnd-apo__msg,
#hlnd-panel-body .hlnd-apo__msg {
	margin: 6px 0 !important;
	padding: 8px 10px;
	border-left: 4px solid #0b4a82;
	background: #e5eef7;
	color: #0b4a82;
	font-weight: 600;
}
#hlnd-wrapper .hlnd-apo__msg[hidden],
#hlnd-panel-body .hlnd-apo__msg[hidden],
#hlnd-wrapper .hlnd-apo__forget[hidden],
#hlnd-panel-body .hlnd-apo__forget[hidden] {
	display: none !important;
}
#hlnd-wrapper .hlnd-apo__msg--warn,
#hlnd-panel-body .hlnd-apo__msg--warn {
	border-left-color: #6b4200;
	background: #fdf1d6;
	color: #6b4200;
}
#hlnd-wrapper .hlnd-apo__forget,
#hlnd-panel-body .hlnd-apo__forget {
	margin: 0 !important;
}
#hlnd-wrapper .hlnd-apo__forget-btn,
#hlnd-panel-body .hlnd-apo__forget-btn {
	min-height: 32px;
	padding: 4px 0;
	border: 0;
	background: none !important;
	color: #0b4a82 !important;
	font: 600 0.95rem/1.2 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	text-decoration: underline;
	cursor: pointer;
}
#hlnd-wrapper .hlnd-apo__legal,
#hlnd-panel-body .hlnd-apo__legal {
	margin: 8px 0 0 !important;
	color: #3c4658;
	font-size: 0.85rem;
}
#hlnd-wrapper .hlnd-apo__legal a,
#hlnd-panel-body .hlnd-apo__legal a {
	color: #0b4a82 !important;
}
