/* ==========================================================================
   Angiologie Köln Core – styles for the plugin blocks
   (opening hours, contact details, directions, 2-click embeds, contact form,
   Datenschutz-Einstellungen). Colours, fonts and spacing come from the theme's
   design tokens (theme.json); the fallbacks keep the blocks usable with other themes.
   ========================================================================== */
:root {
	--angio-icon-tram: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 5l.75-1.5H17V2H7v1.5h4.75L11 5c-3.13.09-6 .73-6 3.5V17c0 1.5 1.11 2.73 2.55 2.95L6 21.5v.5h2l2-2h4l2 2h2v-.5l-1.55-1.55h-.01C17.89 19.73 19 18.5 19 17V8.5c0-2.77-2.87-3.41-6-3.5Zm-1 13.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3ZM17 14H7V9h10v5Z'/%3E%3C/svg%3E");
	--angio-icon-parking: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 3H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2Zm-5.8 10H11v4H9V7h4.2a3 3 0 0 1 0 6Zm0-4H11v2h2.2a1 1 0 0 0 0-2Z'/%3E%3C/svg%3E");
	--angio-icon-car: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.92 6.01A1.5 1.5 0 0 0 17.5 5h-11c-.66 0-1.21.42-1.42 1.01L3 12v8a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-1h12v1a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-8l-2.08-5.99ZM6.5 16a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm11 0a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3ZM5 11l1.5-4.5h11L19 11H5Z'/%3E%3C/svg%3E");
}
/* Fallback tokens (zero specificity – the active theme's values always win). */
:where(:root) {
	--wp--preset--color--primary: #A3241A; --wp--preset--color--primary-dark: #660000; --wp--preset--color--accent: #BF2C1A;
	--wp--preset--color--secondary: #284890; --wp--preset--color--surface: #EFECDF; --wp--preset--color--surface-2: #E6E3D4;
	--wp--preset--color--base: #FAF8F1; --wp--preset--color--ink: #2E1A17; --wp--preset--color--muted: #64524A;
	--wp--preset--color--border: #D8D2BE; --wp--preset--color--accent-soft: #F8E9E3;
	--wp--preset--font-size--small: 0.9375rem; --wp--preset--font-size--caption: 0.8125rem; --wp--preset--font-size--large: 1.25rem;
	--wp--preset--font-size--body: 1rem;
	--wp--custom--radius--sm: 6px; --wp--custom--radius--md: 12px; --wp--custom--radius--pill: 999px;
	--wp--custom--transition: 180ms ease; --wp--custom--color--focus: #284890; --wp--custom--header--height: 96px;
}
.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0;
	position: absolute !important; width: 1px; word-wrap: normal !important;
}

/* ---------- Opening hours ----------------------------------------------- */
.angio-hours__title { font-size: var(--wp--preset--font-size--large); margin: 0 0 0.75rem; }
.angio-hours__table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.angio-hours__table th, .angio-hours__table td { padding: 0.45rem 0; border-bottom: 1px solid var(--wp--preset--color--border); text-align: left; vertical-align: top; }
.angio-hours__table th { width: 4.5rem; font-weight: 700; }
.angio-hours__table abbr { text-decoration: none; }
.angio-hours__range { white-space: nowrap; margin-right: 0.75rem; display: inline-block; }
.angio-hours__closed { color: var(--wp--preset--color--muted); }
.angio-hours__table tr.is-today th, .angio-hours__table tr.is-today td { color: var(--wp--preset--color--primary-dark); font-weight: 700; }
.angio-hours__today {
	display: inline-block; margin-left: 0.35rem; padding: 0 0.4rem; border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--primary); color: #fff; font-size: 0.7rem; font-weight: 700; line-height: 1.5; vertical-align: 0.1em;
}
.angio-hours__note { margin: 0.6rem 0 0; font-weight: 600; }
.angio-hours__open {
	display: flex; gap: 0.6rem; align-items: flex-start; margin: 0.75rem 0 0;
	padding: 0.75rem 1rem; border-radius: var(--wp--custom--radius--sm);
	background: var(--wp--preset--color--surface); font-size: var(--wp--preset--font-size--small);
}
.angio-hours__open svg { flex: none; margin-top: 0.15em; color: var(--wp--preset--color--primary); }
.angio-hours.is-compact .angio-hours__table th, .angio-hours.is-compact .angio-hours__table td { padding: 0.3rem 0; font-size: var(--wp--preset--font-size--small); }

/* ---------- Contact details --------------------------------------------- */
.angio-contact__title { font-size: var(--wp--preset--font-size--large); margin: 0 0 0.75rem; }
.angio-contact__list { font-style: normal; display: grid; gap: 0.75rem; }
.angio-contact__item { display: flex; gap: 0.75rem; align-items: flex-start; margin: 0; }
.angio-contact__icon { flex: none; margin-top: 0.2em; color: var(--wp--preset--color--primary); }
.angio-contact__label { display: block; font-size: var(--wp--preset--font-size--caption); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; color: var(--wp--preset--color--muted); }
.angio-contact__note { color: var(--wp--preset--color--muted); }

/* ---------- Datenschutz-Einstellungen -------------------------------- */
.angio-privacy { background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--border); border-radius: var(--wp--custom--radius--md); padding: clamp(1.25rem, 1rem + 1.5vw, 2rem); scroll-margin-top: calc(var(--wp--custom--header--height) + 32px); }
.angio-privacy:focus { outline: none; }
.angio-privacy:focus-visible { outline: 3px solid var(--wp--custom--color--focus); outline-offset: 2px; }
.angio-privacy__title { margin-top: 0; }
.angio-privacy__list { list-style: none; padding: 0; margin: 1rem 0; display: grid; gap: 0; }
.angio-privacy__item { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.75rem 1.5rem; padding: 1rem 0; border-top: 1px solid var(--wp--preset--color--border); }
.angio-privacy__item:last-child { border-bottom: 1px solid var(--wp--preset--color--border); }
.angio-privacy__text { display: grid; gap: 0.15rem; min-width: 0; flex: 1 1 16rem; }
.angio-privacy__name { font-weight: 700; color: var(--wp--preset--color--primary-dark); }
.angio-privacy__desc { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }
.angio-privacy__status { min-height: 1.5em; margin: 0.75rem 0 0; font-weight: 600; color: var(--wp--preset--color--primary-dark); }
.angio-privacy__actions { margin-top: 1rem; }
.angio-switch { display: inline-flex; align-items: center; gap: 0.6rem; cursor: pointer; min-height: 44px; position: relative; }
.angio-switch input { position: absolute; opacity: 0; width: 52px; height: 30px; margin: 0; cursor: pointer; }
.angio-switch__track { width: 52px; height: 30px; border-radius: 15px; background: #8A7A6E; position: relative; transition: background-color var(--wp--custom--transition); flex: none; }
.angio-switch__track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 50%; background: #fff; transition: transform var(--wp--custom--transition); }
.angio-switch input:checked + .angio-switch__track { background: var(--wp--preset--color--primary); }
.angio-switch input:checked + .angio-switch__track::after { transform: translateX(22px); }
.angio-switch input:focus-visible + .angio-switch__track { outline: 3px solid var(--wp--custom--color--focus); outline-offset: 2px; }
.angio-switch__state { font-size: var(--wp--preset--font-size--small); min-width: 7.5em; }

/* ---------- Directions ------------------------------------------------- */
.angio-directions__title { font-size: var(--wp--preset--font-size--large); margin: 0 0 0.75rem; }
.angio-directions__list { display: grid; gap: 0.875rem; margin: 0; }
.angio-directions__item { display: grid; grid-template-columns: 2.25rem 1fr; column-gap: 0.75rem; }
.angio-directions__item::before {
	content: ""; grid-row: span 2; width: 2.25rem; height: 2.25rem; border-radius: 50%;
	background: var(--wp--preset--color--surface-2);
}
.angio-directions__item { position: relative; }
.angio-directions__item::after {
	content: ""; position: absolute; left: 0.55rem; top: 0.55rem; width: 1.15rem; height: 1.15rem; background: var(--wp--preset--color--primary-dark);
	-webkit-mask: var(--angio-dir-mask) center / contain no-repeat; mask: var(--angio-dir-mask) center / contain no-repeat;
}
.angio-directions__item--tram { --angio-dir-mask: var(--angio-icon-tram); }
.angio-directions__item--parking { --angio-dir-mask: var(--angio-icon-parking); }
.angio-directions__item--car { --angio-dir-mask: var(--angio-icon-car); }
.angio-directions dt { font-size: var(--wp--preset--font-size--caption); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.angio-directions dd { margin: 0; }

/* ---------- 2-click embeds (map / booking) ----------------------------- */
.angio-embed {
	position: relative; min-height: var(--angio-embed-height, 380px);
	border-radius: var(--wp--custom--radius--md); overflow: hidden;
	background:
		repeating-linear-gradient(45deg, transparent 0 14px, rgba(163, 36, 26, 0.04) 14px 28px),
		var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	display: grid; place-items: center;
}
.angio-embed__placeholder { max-width: 34rem; padding: 1.5rem; text-align: center; display: grid; gap: 1rem; justify-items: center; }
.angio-embed__text { margin: 0; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink); }
.angio-embed__remember { font-size: var(--wp--preset--font-size--small); display: inline-flex; gap: 0.5rem; align-items: center; cursor: pointer; }
.angio-embed__remember { min-height: 44px; }
.angio-embed__remember input { width: 24px; height: 24px; flex: none; accent-color: var(--wp--preset--color--primary); }
.angio-embed__admin { font-size: var(--wp--preset--font-size--caption); color: var(--wp--preset--color--accent); margin: 0; }
.angio-embed.is-loaded { display: block; background: none; border: 0; }
.angio-embed__frame { display: block; width: 100%; height: var(--angio-embed-height, 380px); border: 0; }
.angio-map__links, .angio-booking__alt { margin-top: 0.75rem; font-size: var(--wp--preset--font-size--small); }

/* ---------- Contact form ------------------------------------------------ */
.angio-form { display: grid; gap: 1.1rem; }
.angio-form *, .angio-form *::before, .angio-form *::after { box-sizing: border-box; }
.angio-content + .angio-contact-section { padding-top: 0 !important; }
.angio-form__row--2 { display: grid; gap: 1.1rem; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
.angio-form__field { display: grid; gap: 0.35rem; }
.angio-form__field label { font-weight: 600; }
.angio-form__req { color: var(--wp--preset--color--accent); }
.angio-form__optional, .angio-form__hint, .angio-form__required-hint { font-weight: 400; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--small); margin: 0; }
.angio-form input[type="text"], .angio-form input[type="email"], .angio-form input[type="tel"], .angio-form select, .angio-form textarea {
	width: 100%; min-height: 48px; padding: 0.7rem 0.85rem; font: inherit; color: var(--wp--preset--color--ink);
	background: #fff; border: 1.5px solid #8A7A6E; border-radius: var(--wp--custom--radius--sm);
	transition: border-color var(--wp--custom--transition), box-shadow var(--wp--custom--transition);
}
.angio-form select { max-width: 20rem; }
.angio-form textarea { min-height: 9rem; resize: vertical; }
.angio-form :is(input, select, textarea):hover { border-color: var(--wp--preset--color--primary); }
.angio-form :is(input, select, textarea):focus-visible { border-color: var(--wp--preset--color--primary); box-shadow: 0 0 0 3px rgba(163, 36, 26, 0.2); outline: 3px solid transparent; }
.angio-form [aria-invalid="true"] { border-color: var(--wp--preset--color--accent) !important; background: var(--wp--preset--color--accent-soft); }
.angio-form__error { display: flex; gap: 0.4rem; align-items: flex-start; margin: 0; color: var(--wp--preset--color--accent); font-weight: 600; font-size: var(--wp--preset--font-size--small); }
.angio-form__error svg { flex: none; margin-top: 0.2em; }
.angio-form__field--check { grid-template-columns: auto 1fr; align-items: start; column-gap: 0.75rem; }
.angio-form__field--check input { width: 24px; height: 24px; margin-top: 0.1rem; accent-color: var(--wp--preset--color--primary); }
.angio-form__field--check label { font-weight: 400; font-size: var(--wp--preset--font-size--small); }
.angio-form__field--check .angio-form__error { grid-column: 1 / -1; }
.angio-form__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.angio-form__notice { background: var(--wp--preset--color--surface); border-radius: var(--wp--custom--radius--sm); padding: 0.85rem 1rem; font-size: var(--wp--preset--font-size--small); }
.angio-form__summary {
	border: 2px solid var(--wp--preset--color--accent); background: var(--wp--preset--color--accent-soft);
	border-radius: var(--wp--custom--radius--sm); padding: 1rem 1.25rem; margin-bottom: 1.25rem;
}
.angio-form__summary-title { font-size: var(--wp--preset--font-size--body); color: var(--wp--preset--color--accent); margin: 0 0 0.5rem; }
.angio-form__summary ul { margin: 0; padding-left: 1.25rem; }
.angio-form__summary a { color: var(--wp--preset--color--ink); }
.angio-form__success {
	display: flex; gap: 0.75rem; align-items: flex-start; padding: 1.25rem 1.5rem; border-radius: var(--wp--custom--radius--md);
	background: #E7F4EE; border: 2px solid #2E7D5B; color: #1D5840; font-weight: 600;
}
.angio-form__success p { margin: 0; }
.angio-form__actions .wp-element-button { cursor: pointer; font: inherit; font-weight: 600; }

