/* Stage Planet – Komponenten (Events, Tickets, Karten, Nav). */

/* Buttons (Blöcke sp-btn). */
.sp-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	background: var(--wp--preset--color--accent-2);
	color: #fff;
	padding: 0.65em 1.15em;
	border-radius: var(--sp-radius);
	text-decoration: none;
	font-weight: 600;
	transition: background var(--sp-transition);
}
.sp-btn:hover { background: #000; }
.sp-btn--primary { background: var(--wp--preset--color--accent); }
.sp-btn--primary:hover { background: var(--wp--preset--color--accent-2); }
.sp-btn__price { opacity: 0.85; font-weight: 500; }

/* Ticket-CTA-Gruppe. */
.sp-ticket-cta { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 1.5rem 0; }

/* Event-Kurzinfo. */
.sp-event-details { display: grid; gap: 0.35rem; margin: 1rem 0 1.5rem; }
.sp-event-details p { margin: 0; }

/* Event-Status – nie nur Farbe: Text + Form. */
.sp-badge {
	display: inline-block;
	padding: 0.2em 0.7em;
	border-radius: 999px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	border: 1px solid var(--wp--preset--color--line);
}
.sp-event-status[data-status="sold_out"] .sp-badge { background: #2b2b2b; color: #fff; border-color: #2b2b2b; }
.sp-event-status[data-status="cancelled"] .sp-badge,
.sp-event-status[data-status="postponed"] .sp-badge { background: #fdecec; color: #a01722; border-color: #f3b9bd; }
.sp-event-status[data-status="tickets_available"] .sp-badge,
.sp-event-status[data-status="few_tickets"] .sp-badge { background: #eafaf0; color: #12633b; border-color: #b7e6c9; }

/* Grosse Statusmeldung auf Eventdetailseite. */
.sp-status-banner {
	padding: 0.9rem 1.1rem;
	border-radius: var(--sp-radius);
	font-weight: 700;
	margin: 1rem 0;
}
.sp-status-banner--cancelled { background: #fdecec; color: #a01722; }
.sp-status-banner--postponed { background: #fff5e6; color: #8a5300; }

/* Event-/Artikel-Kartenraster. */
.sp-event-cards,
.sp-card-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: clamp(1rem, 3vw, 1.75rem);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
}
.sp-event-card { display: flex; flex-direction: column; }
.sp-event-card__img img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.sp-event-card__body { padding: 0.9rem 1rem 1.1rem; display: grid; gap: 0.3rem; }
.sp-event-card__date { color: var(--wp--preset--color--accent); font-weight: 600; font-size: var(--wp--preset--font-size--small); margin: 0; }
.sp-event-card__title { margin: 0; font-size: var(--wp--preset--font-size--large); }
.sp-event-card__title a { color: inherit; text-decoration: none; }
.sp-event-card__venue { margin: 0; color: var(--wp--preset--color--contrast-2); font-size: var(--wp--preset--font-size--small); }

/* Kalender-Filterleiste. */
.sp-filters { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 1.5rem 0; }
.sp-filters a {
	padding: 0.4em 0.9em;
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 999px;
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	font-size: var(--wp--preset--font-size--small);
}
.sp-filters a[aria-current="true"] { background: var(--wp--preset--color--ink); color: #fff; border-color: var(--wp--preset--color--ink); }

/* Autorenbox. */
.sp-author-box {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	padding: 1.25rem;
	background: var(--wp--preset--color--base-2);
	border-radius: var(--sp-radius);
	margin: 2rem 0;
}
.sp-author-box img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }

/* Sponsored-Hinweis. */
.sp-sponsored {
	font-size: var(--wp--preset--font-size--small);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--wp--preset--color--contrast-2);
	border: 1px solid var(--wp--preset--color--line);
	padding: 0.15em 0.6em;
	border-radius: 4px;
	display: inline-block;
}

/* Header / Navigation. */
.wp-block-template-part.sp-header { background: var(--wp--preset--color--ink); color: #fff; }
.sp-header a { color: #fff; }
.sp-nav-toggle { display: none; }

@media (max-width: 782px) {
	.sp-nav-toggle {
		display: inline-flex;
		background: transparent;
		border: 1px solid rgba(255,255,255,0.4);
		color: #fff;
		border-radius: var(--sp-radius);
		padding: 0.4em 0.7em;
	}
	.sp-nav--mobile { display: none; }
	.sp-nav--mobile.is-open { display: block; }
}

/* Footer. */
.wp-block-template-part.sp-footer { background: var(--wp--preset--color--ink); color: #cfd3dc; }
.sp-footer a { color: #fff; }
