/*!
 * RS Termine – RS-Look für Ausgaben der Eventsplaner-Engine
 * ---------------------------------------------------------------------------
 * Wird nur geladen, wenn das Modul aktiv, „RS-Look“ eingeschaltet ist und die
 * Engine-Styles geladen werden. Alle Regeln hängen an der Body-Klasse
 * .rs-ev-skin (eine Klasse mehr Spezifität als die Engine – ohne !important).
 *
 * Abgedeckt: Einzelansicht (.pep-detail-v3), regelmäßige Veranstaltung
 * (.pep-regular-detail), Monatskalender (.pep-calendar, .pepv2-cal), Karten/Cards
 * (v1 + v2), Archiv im Original-Modus (.pep-archive-page), Anmeldeseite, Karten.
 */

/* ===================================================================== Tokens */
body.rs-ev-skin {
	--pep-accent: var(--rs-c-accent);
	--pep-accent2: var(--rs-c-brass);
	--pep-surface: var(--rs-c-surface);
	--pep-ink: var(--rs-c-ink);
	--pep-muted: var(--rs-c-muted);
	--pep-radius: var(--rs-r-xs);
	--pepv2-accent: var(--rs-area, var(--rs-c-accent));
	--pepv2-accent2: var(--rs-c-brass);
	--pepv2-ink: var(--rs-c-ink);
	--pepv2-muted: var(--rs-c-muted);
	--pepv2-surface: var(--rs-c-surface);
	--pepv2-radius: var(--rs-r-xs);
}
/* Bildfarben der Engine durch die Bereichsfarbe ersetzen (auf Kind-Ebene, da die Engine sie inline setzt) */
.rs-ev-skin :is(.pep-detail-v3, .pep-regular-detail, .pep-archive-page) > *,
.rs-ev-skin :is(.pep-archive-card, .pep-highlight-card, .pep-card) > * {
	--pep-img-accent: var(--rs-area, var(--rs-c-accent));
	--pep-img-accent2: var(--rs-c-brass);
	--pep-archive-dynamic: var(--rs-area, var(--rs-c-accent));
	--pep-soft: color-mix(in srgb, var(--rs-area, var(--rs-c-accent)) 5%, var(--rs-c-paper));
}

/* ===================================================================== Typografie */
.rs-ev-skin :is(.pep-detail, .pep-regular-detail, .pep-calendar, .pep-archive-page, .pep-card, .pep-highlight-card, .pep-hls, .pep-regular-widget, .pep-fallback-compact, .pep-registration-page, .pep-reg-form, [class^="pepv2-"], [class*=" pepv2-"]) {
	font-family: var(--rs-f-body);
	color: var(--rs-c-ink);
}
.rs-ev-skin :is(.pep-detail, .pep-regular-detail, .pep-calendar, .pep-archive-page, .pep-card, .pep-highlight-card, .pep-registration-page, [class^="pepv2-"], [class*=" pepv2-"]) :is(h1, h2, h3, h4) {
	font-family: var(--rs-f-display);
	font-weight: var(--rs-fw-heading);
	letter-spacing: var(--rs-ls-heading);
	line-height: var(--rs-lh-heading);
	color: var(--rs-c-ink);
	text-wrap: balance;
}
.rs-ev-skin .pep-detail-v3 .pep-hero-copy h1,
.rs-ev-skin .pep-regular-detail h1 {
	font-size: var(--rs-fs-h1);
	font-weight: var(--rs-fw-display);
	line-height: var(--rs-lh-display);
	letter-spacing: var(--rs-ls-display);
	color: var(--rs-c-ink);
	overflow-wrap: anywhere;
}
.rs-ev-skin .pep-detail-v3 .pep-lead,
.rs-ev-skin .pep-regular-detail .pep-lead {
	font-family: var(--rs-f-voice);
	font-style: italic;
	font-size: var(--rs-fs-lead);
	line-height: var(--rs-lh-voice);
	color: var(--rs-c-ink-soft);
}
.rs-ev-skin .pep-detail-v3 .pep-detail-content,
.rs-ev-skin .pep-regular-detail .pep-detail-content {
	font-size: var(--rs-fs-body);
	line-height: var(--rs-lh-body);
	color: var(--rs-c-ink-soft);
}
.rs-ev-skin .pep-detail-v3 .pep-detail-content h2 { font-size: var(--rs-fs-h4); margin: 1.6em 0 .5em; }

/* ===================================================================== Einzelansicht */
.rs-ev-skin .pep-detail-v3 { color: var(--rs-c-ink); background: transparent; }
.rs-ev-skin .pep-detail-v3 .pep-detail-hero {
	background: var(--rs-c-paper);
	border-radius: 0 0 var(--rs-r-xl) 0;
	min-height: 0;
	padding-block: clamp(40px, 7vw, 112px);
}
.rs-ev-skin .pep-detail-v3 .pep-detail-hero::after { display: none; }
.rs-ev-skin .pep-detail-v3 .pep-hero-media img,
.rs-ev-skin .pep-detail-v3 .pep-hero-placeholder,
.rs-ev-skin .pep-detail-v3 .pep-hero-media::after { border-radius: var(--rs-r-leaf); }
.rs-ev-skin .pep-detail-v3 .pep-hero-media img { box-shadow: var(--rs-shadow-2); }
.rs-ev-skin .pep-detail-v3 .pep-hero-placeholder { background: var(--rs-c-stone); opacity: 1; }
.rs-ev-skin .pep-detail-v3 .pep-chip,
.rs-ev-skin .pep-regular-detail .pep-chip {
	background: transparent; box-shadow: none; font: 500 .85rem/1.2 var(--rs-f-ui);
	border: 1px solid color-mix(in srgb, var(--rs-area, var(--rs-c-accent)) 40%, transparent);
	color: var(--rs-area, var(--rs-c-accent));
	border-radius: var(--rs-r-pill);
}
.rs-ev-skin .pep-detail-v3 .pep-detail-facts span {
	background: transparent; box-shadow: none; border: 1px solid var(--rs-c-line);
	font: 500 var(--rs-fs-small)/1.3 var(--rs-f-ui); color: var(--rs-c-ink-soft);
}
.rs-ev-skin .pep-detail-v3 .pep-date-pill { background: var(--rs-c-ink); color: var(--rs-c-paper); border-color: var(--rs-c-ink); }
.rs-ev-skin .pep-detail-v3 .pep-detail-grid { width: min(100% - 2 * var(--rs-gutter), var(--rs-container)); gap: clamp(24px, 4vw, 64px); }
.rs-ev-skin .pep-detail-v3 .pep-detail-content,
.rs-ev-skin .pep-detail-v3 .pep-detail-side,
.rs-ev-skin .pep-detail-v3 .pep-content-panel {
	border: 0; box-shadow: none; border-radius: 0; background: transparent; padding: 0;
}
.rs-ev-skin .pep-detail-v3 .pep-detail-side {
	top: calc(var(--rs-header-h) + 24px);
	padding: clamp(20px, 2.4vw, 32px);
	background: var(--rs-c-surface);
	border: 1px solid var(--rs-c-line);
	border-radius: var(--rs-r-leaf);
}
.rs-ev-skin .pep-detail-v3 .pep-detail-side h2 { font-size: var(--rs-fs-h4); color: var(--rs-c-ink); }
.rs-ev-skin .pep-detail-v3 .pep-info-item {
	background: transparent; border: 0; border-top: 1px solid var(--rs-c-line); border-radius: 0; padding: 14px 0 4px;
}
.rs-ev-skin .pep-detail-v3 .pep-info-item span {
	text-transform: none; letter-spacing: 0; font: 500 .82rem/1.3 var(--rs-f-ui); color: var(--rs-area, var(--rs-c-accent));
}
.rs-ev-skin .pep-detail-v3 .pep-info-item strong { font: 500 1rem/1.35 var(--rs-f-ui); color: var(--rs-c-ink); }
.rs-ev-skin .pep-detail-v3 .pep-org-item { border-radius: var(--rs-r-s); border-color: var(--rs-c-line); }
.rs-ev-skin .pep-detail-v3 .pep-org-item img,
.rs-ev-skin .pep-detail-v3 .pep-org-avatar { border-radius: var(--rs-r-s); background: var(--rs-c-stone); }
.rs-ev-skin .pep-detail-v3 .pep-org-box > strong { color: var(--rs-c-ink); font-family: var(--rs-f-display); font-weight: var(--rs-fw-heading); }
.rs-ev-skin .pep-detail-v3 .pep-mini-label { font-weight: 600; letter-spacing: .02em; text-transform: none; }
.rs-ev-skin .pep-detail-v3 .pep-schedule { font-family: var(--rs-f-ui); line-height: 1.7; }
.rs-ev-skin .pep-detail-v3 .pep-related-card { border-radius: var(--rs-r-leaf); }

/* ===================================================================== Buttons (wie .rs-btn) */
.rs-ev-skin :is(.pep-detail-v3, .pep-regular-detail, .pep-registration-page, .pep-archive-page) :is(.pep-button, .pep-btn, .pep-archive-button),
.rs-ev-skin .pep-reg-form .pep-btn,
.rs-ev-skin .pepv2-btn {
	position: relative; isolation: isolate; overflow: hidden;
	min-height: 48px; padding: .8em 1.5em;
	border-radius: var(--rs-r-pill);
	background: var(--rs-c-ink);
	border: 1px solid var(--rs-c-ink);
	box-shadow: none;
	font: 550 var(--rs-fs-button)/1.2 var(--rs-f-ui);
	letter-spacing: .005em;
	transition: background-color var(--rs-dur-fast), border-color var(--rs-dur-fast), color var(--rs-dur-fast), transform .5s var(--rs-ease-out);
}
.rs-ev-skin :is(.pep-detail-v3, .pep-regular-detail, .pep-registration-page, .pep-archive-page) :is(.pep-button, .pep-btn, .pep-archive-button):hover,
.rs-ev-skin .pep-reg-form .pep-btn:hover,
.rs-ev-skin .pepv2-btn:hover {
	background: var(--rs-area, var(--rs-c-accent));
	border-color: var(--rs-area, var(--rs-c-accent));
	transform: none;
}
.rs-ev-skin .pep-detail-v3 .pep-button-ghost,
.rs-ev-skin .pep-btn.secondary {
	background: transparent;
	border-color: color-mix(in srgb, var(--rs-c-ink) 35%, transparent);
}
.rs-ev-skin .pep-detail-v3 .pep-button-ghost:hover {
	background: color-mix(in srgb, var(--rs-area, var(--rs-c-accent)) 10%, transparent);
	border-color: var(--rs-area, var(--rs-c-accent));
}
.rs-ev-skin .pep-btn.secondary:hover { color: #fff; }
.rs-ev-skin .pep-detail-v3 .rs-ev-inquiry-btn { background: var(--rs-area, var(--rs-c-accent)); border-color: var(--rs-area, var(--rs-c-accent)); }
.rs-ev-skin .pep-detail-v3 .rs-ev-inquiry-btn:hover { background: var(--rs-c-ink); border-color: var(--rs-c-ink); }
.rs-ev-skin .pep-detail-v3 .pep-subtle-btn,
.rs-ev-skin .pep-detail-v3 .pep-org-links a {
	font: 550 .9rem/1.3 var(--rs-f-ui);
	color: var(--rs-c-ink);
	text-decoration: none;
	background: linear-gradient(currentColor, currentColor) 0 100% / 100% var(--rs-line-w) no-repeat;
	border: 0; border-radius: 0; padding: .2em 0; box-shadow: none;
}
.rs-ev-skin .pep-detail-v3 .pep-subtle-btn:hover { color: var(--rs-area, var(--rs-c-accent)); background-size: 0 var(--rs-line-w); background-position: 100% 100%; }

/* ===================================================================== Status (abgesagt / verschoben) */
.rs-ev-skin .pep-status-ribbon span { font-weight: 600; letter-spacing: .04em; }
.rs-ev-skin .pep-status-ribbon-cancelled span { background: var(--rs-c-error); }
.rs-ev-skin .pep-status-ribbon-postponed span { background: color-mix(in srgb, var(--rs-c-brass) 70%, #000); }

/* ===================================================================== Karten & Cards (v1) */
.rs-ev-skin :is(.pep-card, .pep-highlight-card, .pep-regular-card, .pep-regular-fallback-row, .pep-related-card) {
	border-radius: var(--rs-r-leaf);
	box-shadow: none;
	border-color: var(--rs-c-line);
}
.rs-ev-skin :is(.pep-card, .pep-highlight-card) :is(img, .pep-thumb, .pep-hl-media) { border-radius: var(--rs-r-leaf); }
.rs-ev-skin :is(.pep-card, .pep-highlight-card, .pep-hls) :is(.pep-chip, .pep-status-tag) {
	border-radius: var(--rs-r-pill); font-weight: 500; box-shadow: none;
}
.rs-ev-skin .pep-date-visual,
.rs-ev-skin .pep-date-calendar,
.rs-ev-skin .pep-date-split { font-family: var(--rs-f-display); font-variant-numeric: tabular-nums; }
.rs-ev-skin .pep-empty,
.rs-ev-skin .pepv2-empty {
	border: 1px dashed var(--rs-c-line); background: transparent; border-radius: var(--rs-r-leaf);
	color: var(--rs-c-ink-soft); font-weight: 400;
}

/* ===================================================================== Monatskalender (v1 + v2) */
.rs-ev-skin .pep-calendar {
	background: transparent; box-shadow: none; border: 0; padding: 0;
}
.rs-ev-skin .pep-cal-head h2 { font-size: var(--rs-fs-h3); }
.rs-ev-skin .pep-cal-weekdays span { font: 500 .8rem/1 var(--rs-f-ui); color: var(--rs-c-muted); }
.rs-ev-skin .pep-cal-day {
	border-radius: var(--rs-r-s); background: transparent; border: 0; border-top: 1px solid var(--rs-c-line);
}
.rs-ev-skin .pep-cal-day strong { font: 300 1.4rem/1 var(--rs-f-display); }
.rs-ev-skin .pep-cal-day a {
	border-radius: var(--rs-r-xs) var(--rs-r-xs) var(--rs-r-m) var(--rs-r-xs);
	background: color-mix(in srgb, var(--rs-c-accent) 10%, transparent);
	color: var(--rs-c-ink); font-weight: 500;
	border-left: 2px solid var(--rs-c-accent);
}
.rs-ev-skin .pep-cal-day.is-today { outline: 0; box-shadow: inset 0 var(--rs-line-w) 0 var(--rs-c-accent); }
.rs-ev-skin .pepv2-cal { border-radius: var(--rs-r-leaf); box-shadow: none; }
.rs-ev-skin .pepv2-cal-dot { background: var(--rs-c-accent); }

/* ===================================================================== Archiv (Original-Modus) */
.rs-ev-skin .pep-archive-page { --pep-card-radius: var(--rs-r-xs); }
.rs-ev-skin .pep-archive-page .pep-archive-hero h1 { font-size: var(--rs-fs-h1); font-weight: var(--rs-fw-display); letter-spacing: var(--rs-ls-display); }
.rs-ev-skin .pep-archive-page .pep-archive-eyebrow,
.rs-ev-skin .pep-archive-page .pep-archive-section-head > span { font: 500 var(--rs-fs-eyebrow)/1.2 var(--rs-f-ui); letter-spacing: .01em; text-transform: none; color: var(--rs-c-accent); }

/* ===================================================================== Anmeldung (Pro) */
.rs-ev-skin :is(.pep-pro-card, .pep-reg-form, .pep-reg-hero) {
	background: var(--rs-c-surface); border: 1px solid var(--rs-c-line); box-shadow: none; border-radius: var(--rs-r-leaf);
}
.rs-ev-skin .pep-reg-hero h1 { font-weight: var(--rs-fw-display); letter-spacing: var(--rs-ls-display); }
.rs-ev-skin .pep-reg-form :is(input, textarea, select) {
	min-height: 52px; border-radius: var(--rs-r-m); border-color: var(--rs-c-line); font: 400 1rem/1.4 var(--rs-f-body); color: var(--rs-c-ink);
}
.rs-ev-skin .pep-reg-form :is(input, textarea, select):focus { outline: none; border-color: var(--rs-c-ink); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rs-c-accent) 18%, transparent); }
.rs-ev-skin .pep-reg-form label { font: 500 .9rem/1.3 var(--rs-f-ui); }
.rs-ev-skin .pep-pill { font-weight: 500; background: var(--rs-c-ink); }

/* ===================================================================== Karten (OSM) */
.rs-ev-skin .pep-map { border-radius: var(--rs-r-leaf); box-shadow: none; border-color: var(--rs-c-line); background: var(--rs-c-paper); }
.rs-ev-skin .pep-map-fallback { border-radius: var(--rs-r-leaf); background: transparent; border-color: var(--rs-c-line); }
.rs-ev-skin .pep-map-fallback strong { color: var(--rs-c-ink); }

/* ===================================================================== Fokus */
.rs-ev-skin :is(.pep-detail-v3, .pep-regular-detail, .pep-calendar, .pep-archive-page, .pep-reg-form) :focus-visible {
	outline: 2px solid var(--rs-c-focus); outline-offset: 3px;
}