/**
 * Rettig — minimum CSS that WordPress block settings cannot express.
 *
 * Priority order for every UI change:
 * 1) WordPress editor / block settings (spacing, typography, colors, radius, layout)
 * 2) Existing theme block styles (styles/rettig.json)
 * 3) Only then: rules in this file (plugin markup, overflow, forced mobile layout)
 *
 * Do not add padding/margin/font-size/color here if the block sidebar can set it.
 * Scope every rule to the page/template/plugin root so nothing leaks sitewide.
 *
 * Enqueued via inc/Assets.php (handle: cg-theme-mobile-responsive). Brand: rettig.
 */

/* -------------------------------------------------------------------------
   Smooth in-page anchors (sticky header offset) — not available as block setting
   Pair with assets/js/smooth-transition.js
   ------------------------------------------------------------------------- */
html {
	scroll-behavior: smooth;
	scroll-padding-top: 100px;
}

#preises {
	scroll-margin-top: 120px;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

/* -------------------------------------------------------------------------
   Legal pages — long URL / heading wrap (block settings cannot force this)
   Assign Additional CSS class `legal-wrap` on the content Group (or wrapper)
   via the editor: Block → Advanced → Additional CSS class(es).
   ------------------------------------------------------------------------- */
.legal-wrap {
	overflow-x: clip;
	max-width: 100%;
}

.legal-wrap,
.legal-wrap p,
.legal-wrap li,
.legal-wrap a {
	overflow-wrap: anywhere;
	word-break: break-word;
}

@media (max-width: 781px) {
	.legal-wrap h1,
	.legal-wrap h2,
	.legal-wrap h3,
	.legal-wrap h4,
	.legal-wrap h5,
	.legal-wrap h6,
	.legal-wrap .wp-block-heading {
		overflow-wrap: anywhere;
		word-break: break-word;
		hyphens: auto;
		-webkit-hyphens: auto;
	}
}

/* -------------------------------------------------------------------------
   Page titles on narrow screens — the h1 preset floors at 2rem, which is
   wider than the content column for single German compounds
   (GRUNDQUALIFIKATION, BILDUNGSGUTSCHEIN). Nothing wraps them, so they
   overflow the hero to the right. Scale with the viewport instead.
   Fluid presets cannot express a viewport-only floor.
   ------------------------------------------------------------------------- */
@media (max-width: 781px) {
	/* !important: core prints preset sizes (.has-xx-large-font-size) as
	   !important, and hero titles carry an inline clamp of their own. */
	h1.wp-block-heading {
		font-size: clamp(1.3rem, 6.5vw, 2rem) !important;
	}

	/* Hero titles sit in a wider column, so they can stay a size up. */
	h1.is-style-hero-title {
		font-size: clamp(1.5rem, 7.6vw, 3rem) !important;
	}
}

/* -------------------------------------------------------------------------
   Media card on narrow screens — the section gutter plus the 48px text-column
   padding leaves ~230px on a 390px screen, so long German compounds
   (BILDUNGSGUTSCHEIN) hit core's `word-break: break-word` on .wp-block-column
   and split mid-word. Move the breathing room inside: the card runs closer to
   the screen edge, the text keeps a generous inset.
   Media queries are not expressible in theme.json variation `css`.
   ------------------------------------------------------------------------- */
@media (max-width: 781px) {
	/* !important throughout: the blocks carry their padding as inline styles. */
	.is-style-media-card .wp-block-column > .wp-block-group {
		padding: 2rem 1.75rem !important;
	}

	.is-style-media-card .is-style-section-title {
		font-size: clamp(1.5rem, 6.6vw, 2rem);
	}
}

/* Phones only — tablets keep the normal section gutter. */
@media (max-width: 600px) {
	.wp-block-group.alignfull:has(> .is-style-media-card) {
		padding-left: 0.75rem !important;
		padding-right: 0.75rem !important;
	}
}

@media (max-width: 400px) {
	.is-style-media-card .wp-block-column > .wp-block-group {
		padding: 1.75rem 1.5rem !important;
	}

	.is-style-media-card .is-style-section-title {
		font-size: clamp(1.3rem, 6.6vw, 2rem);
	}
}

/* -------------------------------------------------------------------------
   FAQ carousel — plugin markup (.cap-faq-carousel); blocks cannot reposition arrows
   ------------------------------------------------------------------------- */
@media (max-width: 781px) {
	.wp-block-group.alignfull:has(.cap-faq-carousel) {
		padding-left: 0.75rem !important;
		padding-right: 0.75rem !important;
	}

	.cap-faq-carousel {
		padding-bottom: 4.25rem;
		width: 100%;
		max-width: 100%;
	}

	.cap-faq-carousel__track {
		padding-left: 0;
		padding-right: 0;
		gap: 0.75rem;
		scroll-padding: 0;
	}

	.cap-faq-carousel__card {
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
		padding: 1.15rem 0.95rem;
	}

	.cap-faq-carousel__arrow {
		top: auto;
		bottom: 0;
		width: 2.75rem;
		height: 2.75rem;
		transform: none;
		box-shadow: 0 4px 14px rgba(19, 33, 51, 0.16);
	}

	.cap-faq-carousel__arrow:disabled {
		transform: none;
	}

	.cap-faq-carousel__arrow svg {
		width: 1.1rem;
		height: 1.1rem;
	}

	.cap-faq-carousel__arrow--prev {
		left: calc(50% - 3.25rem);
		right: auto;
	}

	.cap-faq-carousel__arrow--next {
		left: calc(50% + 0.5rem);
		right: auto;
	}
}

/* -------------------------------------------------------------------------
   Standorte / KFA — mobile branch cards
   Plugin .cap-branch-search only; scoped to archive-branch + branch-lkw-bus.
   No hover. Map radius / CTA spacing → use block settings / block custom CSS.
   ------------------------------------------------------------------------- */
@media (max-width: 781px) {
	.post-type-archive-branch .cap-branch-search,
	.page-template-branch-lkw-bus .cap-branch-search {
		padding-inline: 0;
		width: 100%;
		max-width: 100%;
	}

	.post-type-archive-branch .cap-branch-search__table,
	.page-template-branch-lkw-bus .cap-branch-search__table {
		border-top: 0 !important;
		display: flex !important;
		flex-direction: column;
		gap: 16px;
	}

	.post-type-archive-branch .cap-branch-search__head,
	.page-template-branch-lkw-bus .cap-branch-search__head {
		display: none !important;
	}

	.post-type-archive-branch .cap-branch-search__row,
	.page-template-branch-lkw-bus .cap-branch-search__row {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		grid-template-columns: none !important;
		gap: 0 !important;
		padding: 0 !important;
		margin: 0 !important;
		border: 1px solid #e8ebf0 !important;
		border-bottom: 1px solid #e8ebf0 !important;
		border-radius: 16px !important;
		background: #fff !important;
		box-shadow: 0 1px 3px rgba(18, 33, 51, 0.05);
		overflow: hidden;
		transition: none !important;
	}

	.post-type-archive-branch .cap-branch-search__row:nth-child(even),
	.post-type-archive-branch .cap-branch-search__row:hover,
	.post-type-archive-branch .cap-branch-search__row:focus,
	.post-type-archive-branch .cap-branch-search__row:active,
	.page-template-branch-lkw-bus .cap-branch-search__row:nth-child(even),
	.page-template-branch-lkw-bus .cap-branch-search__row:hover,
	.page-template-branch-lkw-bus .cap-branch-search__row:focus,
	.page-template-branch-lkw-bus .cap-branch-search__row:active {
		background: #fff !important;
	}

	.post-type-archive-branch .cap-branch-search__row > div::before,
	.page-template-branch-lkw-bus .cap-branch-search__row > div::before {
		content: none !important;
		display: none !important;
		margin: 0 !important;
	}

	.post-type-archive-branch .cap-branch-search__loc-icon,
	.page-template-branch-lkw-bus .cap-branch-search__loc-icon {
		display: none !important;
	}

	.post-type-archive-branch .cap-branch-search__loc,
	.page-template-branch-lkw-bus .cap-branch-search__loc {
		display: block !important;
		padding: 16px 16px 6px !important;
		gap: 0 !important;
	}

	.post-type-archive-branch .cap-branch-search__loc > span,
	.page-template-branch-lkw-bus .cap-branch-search__loc > span {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 6px 8px;
	}

	.post-type-archive-branch .cap-branch-search__city,
	.page-template-branch-lkw-bus .cap-branch-search__city {
		flex: 1 1 100%;
		font-size: 1.125rem !important;
		font-weight: 800 !important;
		line-height: 1.25;
		letter-spacing: -0.01em;
		color: var(--wp--preset--color--primary, #cc1236) !important;
		text-decoration: none !important;
	}

	.post-type-archive-branch .cap-branch-search__city:hover,
	.post-type-archive-branch .cap-branch-search__city:focus,
	.post-type-archive-branch .cap-branch-search__city:focus-visible,
	.page-template-branch-lkw-bus .cap-branch-search__city:hover,
	.page-template-branch-lkw-bus .cap-branch-search__city:focus,
	.page-template-branch-lkw-bus .cap-branch-search__city:focus-visible {
		text-decoration: none !important;
		color: var(--wp--preset--color--primary, #cc1236) !important;
	}

	.post-type-archive-branch .cap-branch-search__cats,
	.page-template-branch-lkw-bus .cap-branch-search__cats {
		margin: 0;
		font-size: 0.8125rem !important;
		font-weight: 500 !important;
		color: #5d6b84 !important;
	}

	.post-type-archive-branch .cap-branch-search__loc .cap-branch-search__icon--automatic-transmission,
	.post-type-archive-branch .cap-branch-search__loc .cap-branch-search__icon--track-training,
	.page-template-branch-lkw-bus .cap-branch-search__loc .cap-branch-search__icon--automatic-transmission,
	.page-template-branch-lkw-bus .cap-branch-search__loc .cap-branch-search__icon--track-training {
		width: 14px;
		height: 14px;
		opacity: 0.75;
	}

	.post-type-archive-branch .cap-branch-search__addr,
	.page-template-branch-lkw-bus .cap-branch-search__addr {
		padding: 0 16px 14px !important;
	}

	.post-type-archive-branch .cap-branch-search__addr-main,
	.page-template-branch-lkw-bus .cap-branch-search__addr-main {
		font-size: 0.9375rem !important;
		font-weight: 500 !important;
		color: #33425a !important;
		line-height: 1.45;
	}

	.post-type-archive-branch .cap-branch-search__addr-info,
	.page-template-branch-lkw-bus .cap-branch-search__addr-info {
		display: block;
		margin-top: 2px;
		font-size: 0.8125rem !important;
		font-weight: 400 !important;
		color: #6b7888 !important;
	}

	.post-type-archive-branch .cap-branch-search__hours:not(:has(.cap-branch-search__hours-value)),
	.page-template-branch-lkw-bus .cap-branch-search__hours:not(:has(.cap-branch-search__hours-value)) {
		display: none !important;
	}

	.post-type-archive-branch .cap-branch-search__hours:has(.cap-branch-search__hours-value),
	.page-template-branch-lkw-bus .cap-branch-search__hours:has(.cap-branch-search__hours-value) {
		padding: 0 16px 12px !important;
		font-size: 0.875rem !important;
		font-weight: 600 !important;
		color: #122133 !important;
	}

	.post-type-archive-branch .cap-branch-search__contact,
	.page-template-branch-lkw-bus .cap-branch-search__contact {
		display: flex !important;
		flex-direction: column !important;
		width: 100% !important;
		max-width: 100% !important;
		align-self: stretch !important;
		align-items: stretch !important;
		box-sizing: border-box;
		margin: 0 !important;
		padding: 12px 16px !important;
		border-top: 1px solid #eef1f5 !important;
		background: #f7f8fa !important;
		text-align: left !important;
		gap: 10px !important;
	}

	.post-type-archive-branch .cap-branch-search__contact a,
	.page-template-branch-lkw-bus .cap-branch-search__contact a {
		display: grid !important;
		grid-template-columns: 20px 1fr;
		align-items: center;
		column-gap: 10px;
		white-space: normal !important;
		overflow-wrap: anywhere;
		font-size: 0.875rem !important;
		font-weight: 600 !important;
		color: #122133 !important;
		line-height: 1.35;
		text-decoration: none !important;
	}

	.post-type-archive-branch .cap-branch-search__contact a:hover,
	.post-type-archive-branch .cap-branch-search__contact a:focus,
	.post-type-archive-branch .cap-branch-search__contact a:focus-visible,
	.page-template-branch-lkw-bus .cap-branch-search__contact a:hover,
	.page-template-branch-lkw-bus .cap-branch-search__contact a:focus,
	.page-template-branch-lkw-bus .cap-branch-search__contact a:focus-visible {
		color: #122133 !important;
		text-decoration: none !important;
	}

	.post-type-archive-branch .cap-branch-search__contact .cap-branch-search__icon,
	.page-template-branch-lkw-bus .cap-branch-search__contact .cap-branch-search__icon {
		width: 16px;
		height: 16px;
		color: #5d6b84;
		justify-self: center;
	}
}