/* UitEten — minimale, merk-neutrale styling. Erft thema-fonts/kleuren via inherit
   en CSS-variabelen met nette fallbacks; geen agressieve overrides. */
.uiteten-archive,
.uiteten-single { max-width: 1100px; margin: 0 auto; padding: 1.5rem 1rem 3rem; }

.uiteten-archive__header h1,
.uiteten-single__head h1 { margin: 0 0 .25rem; line-height: 1.15; }
.uiteten-intro { max-width: 65ch; opacity: .85; margin: .25rem 0 1.5rem; }

/* Filterbalk */
.uiteten-filters {
	display: flex; flex-wrap: wrap; gap: .5rem; align-items: center;
	padding: 1rem; margin-bottom: 1rem;
	background: var(--wp--preset--color--base-2, rgba(0,0,0,.04));
	border-radius: 12px;
}
.uiteten-filters input[type="search"],
.uiteten-filters select {
	padding: .5rem .65rem; border: 1px solid rgba(0,0,0,.15);
	border-radius: 8px; font: inherit; background: #fff; color: inherit;
}
.uiteten-search { flex: 1 1 220px; min-width: 180px; }
.uiteten-check { display: inline-flex; align-items: center; gap: .35rem; font-size: .9rem; }

.uiteten-count { font-size: .9rem; opacity: .7; margin: .25rem 0 1rem; }

/* Grid + kaarten */
.uiteten-grid {
	display: grid; gap: 1.25rem;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}
.uiteten-card {
	display: flex; flex-direction: column; text-decoration: none; color: inherit;
	border: 1px solid rgba(0,0,0,.08); border-radius: 14px; overflow: hidden;
	background: #fff; transition: transform .15s ease, box-shadow .15s ease;
}
.uiteten-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,.10); }
.uiteten-card.is-featured { border-color: var(--wp--preset--color--accent, #d9a441); }
.uiteten-card__media { position: relative; aspect-ratio: 16/10; background: #eee; }
.uiteten-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.uiteten-card__body { padding: .85rem 1rem 1.1rem; }
.uiteten-card__body h3 { margin: 0 0 .25rem; font-size: 1.1rem; }
.uiteten-card__meta { font-size: .85rem; opacity: .75; margin: 0 0 .5rem; }
.uiteten-card__excerpt { font-size: .9rem; margin: 0; opacity: .9; }

/* Foto-fallback (gradient + initiaal) */
.uiteten-fallback {
	position: absolute; inset: 0; display: grid; place-items: center;
	background: linear-gradient(135deg, #2b6cb0, #1a365d); color: #fff;
}
.uiteten-fallback span { font-size: 2.5rem; font-weight: 700; opacity: .8; }

.uiteten-badge {
	position: absolute; top: .5rem; left: .5rem; z-index: 2;
	background: var(--wp--preset--color--accent, #d9a441); color: #1a202c;
	font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
	padding: .2rem .5rem; border-radius: 6px;
}

.uiteten-empty, .uiteten-error { padding: 1.5rem; text-align: center; opacity: .8; }
.uiteten-error { color: #b00020; }
.uiteten-more {
	display: block; margin: 1.5rem auto 0; padding: .6rem 1.4rem;
	border: 1px solid rgba(0,0,0,.2); border-radius: 999px; background: #fff;
	font: inherit; cursor: pointer;
}

/* Detailpagina */
.uiteten-single__media { margin: 1rem 0; border-radius: 16px; overflow: hidden; aspect-ratio: 16/9; position: relative; background: #eee; }
.uiteten-single__media img { width: 100%; height: 100%; object-fit: cover; }
.uiteten-cta { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1rem 0 1.5rem; }
.uiteten-btn {
	display: inline-block; padding: .6rem 1.1rem; border-radius: 999px;
	border: 1px solid rgba(0,0,0,.2); text-decoration: none; color: inherit; font-weight: 600;
}
.uiteten-btn--primary { background: var(--wp--preset--color--accent, #d9a441); border-color: transparent; color: #1a202c; }
.uiteten-meta { opacity: .8; }
.uiteten-facts { display: grid; grid-template-columns: max-content 1fr; gap: .35rem 1rem; margin: 1.5rem 0; }
.uiteten-facts dt { font-weight: 600; opacity: .7; }
.uiteten-facts dd { margin: 0; }
.uiteten-tags { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; margin: 1rem 0; }
.uiteten-tags li { background: rgba(0,0,0,.06); border-radius: 999px; padding: .25rem .75rem; font-size: .85rem; }
.uiteten-back { margin-top: 2rem; }

@media (max-width: 480px) {
	.uiteten-filters { padding: .75rem; }
	.uiteten-search { flex-basis: 100%; }
}
