/* Blokken van de Vibe-plugin. Kleuren komen uit het Vibe-thema (met reservewaarden voor andere thema's). */
.vibe-kaarten { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.vibe-kaarten--vier { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 900px) { .vibe-kaarten, .vibe-kaarten--vier { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .vibe-kaarten { grid-template-columns: minmax(0, 1fr); } }

.vibe-kaart { display: flex; flex-direction: column; min-width: 0; background: var(--vibe-surface, #fff); border: 1px solid var(--vibe-line, #d5dbe7); border-radius: var(--vibe-radius, 12px); overflow: hidden; color: inherit; text-decoration: none; transition: border-color .2s ease, transform .2s ease; }
a.vibe-kaart:hover { border-color: var(--vibe-accent, #1d3b80); transform: translateY(-2px); }
.vibe-kaart__beeld { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; max-width: 100%; }
.vibe-leeg { display: grid; place-items: center; color: var(--vibe-muted, #56617c); font-size: .85rem; background: repeating-linear-gradient(135deg, var(--vibe-surface-2, #e9edf5) 0 10px, var(--vibe-surface, #fff) 10px 20px); }
.vibe-kaart__body { padding: 1.1rem 1.1rem .5rem; display: grid; gap: .6rem; align-content: start; flex: 1; }
.vibe-kaart__body h3 { margin: 0; font-size: 1.1rem; }
.vibe-kaart__body p { margin: 0; color: var(--vibe-muted, #56617c); }
.vibe-kaart__voet { padding: .75rem 1.1rem 1.1rem; display: flex; justify-content: space-between; align-items: center; gap: .75rem; flex-wrap: wrap; }

.vibe-tag { justify-self: start; font-family: var(--wp--preset--font-family--mono, monospace); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; padding: .2rem .5rem; border-radius: 6px; background: var(--vibe-surface-2, #e9edf5); color: var(--vibe-muted, #56617c); }
.vibe-tag--hot { background: color-mix(in srgb, var(--vibe-amber, #ffba44) 28%, transparent); color: var(--vibe-fg, #0f1b38); }

.vibe-specs { list-style: none; margin: 0; padding: 0; display: grid; gap: .25rem; }
.vibe-specs li { display: flex; justify-content: space-between; gap: .75rem; padding: .25rem 0; border-bottom: 1px dashed var(--vibe-line, #d5dbe7); font-size: .9rem; }
.vibe-specs li span:first-child { color: var(--vibe-muted, #56617c); }
.vibe-specs li span:last-child { text-align: right; }

.vibe-prijs { font-family: var(--wp--preset--font-family--display, inherit); font-weight: 600; font-size: 1.2rem; margin: 0; }
.vibe-prijs small { display: block; font-family: var(--wp--preset--font-family--body, inherit); font-size: .75rem; font-weight: 500; color: var(--vibe-muted, #56617c); }
.vibe-prijs--groot { font-size: 1.8rem; }
.vibe-knop-klein { font-size: .85rem; font-weight: 600; padding: .45rem .9rem; border: 1px solid var(--vibe-line, #d5dbe7); border-radius: 999px; }

.vibe-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.vibe-chip { font: inherit; font-size: .9rem; padding: .4rem .9rem; border-radius: 999px; border: 1px solid var(--vibe-line, #d5dbe7); background: var(--vibe-surface, #fff); color: var(--vibe-fg, #0f1b38); cursor: pointer; }
.vibe-chip:hover { border-color: var(--vibe-accent, #1d3b80); }
.vibe-chip[aria-pressed="true"] { background: var(--vibe-accent, #1d3b80); border-color: var(--vibe-accent, #1d3b80); color: var(--vibe-accent-ink, #fff); }

.vibe-tabel-wrap { overflow-x: auto; border: 1px solid var(--vibe-line, #d5dbe7); border-radius: var(--vibe-radius, 12px); background: var(--vibe-surface, #fff); }
.vibe-tabel { width: 100%; min-width: 720px; border-collapse: collapse; font-size: .92rem; }
.vibe-tabel th, .vibe-tabel td { padding: .8rem .9rem; border-bottom: 1px solid var(--vibe-line, #d5dbe7); text-align: left; vertical-align: top; }
.vibe-tabel thead th { font-family: var(--wp--preset--font-family--mono, monospace); font-size: .74rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--vibe-muted, #56617c); background: var(--vibe-surface-2, #e9edf5); }
.vibe-tabel tbody th a { font-weight: 600; color: inherit; }
.vibe-tabel tbody th span { display: block; font-weight: 400; font-size: .85rem; color: var(--vibe-muted, #56617c); }
.vibe-tabel tbody tr:last-child > * { border-bottom: 0; }
.vibe-tabel tr.is-passend > * { background: color-mix(in srgb, var(--vibe-amber, #ffba44) 16%, transparent); }
.vibe-num { font-variant-numeric: tabular-nums; white-space: nowrap; }

.vibe-details { background: var(--vibe-surface, #fff); border: 1px solid var(--vibe-line, #d5dbe7); border-radius: 14px; padding: 1.4rem; display: grid; gap: .75rem; }
.vibe-details__label { margin: .25rem 0 0; font-family: var(--wp--preset--font-family--mono, monospace); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--vibe-muted, #56617c); }
.vibe-details__gasten, .vibe-details__extra { margin: 0; color: var(--vibe-muted, #56617c); }
.vibe-details .vibe-chips { margin: 0; }

.vibe-datumcheck { background: var(--vibe-surface, #fff); border: 1px solid var(--vibe-line, #d5dbe7); border-radius: 16px; padding: 1.5rem; display: grid; gap: .9rem; box-shadow: 0 20px 60px rgba(10, 18, 40, .18); color: var(--vibe-fg, #0f1b38); }
.vibe-datumcheck__titel { margin: 0; font-size: 1.15rem; }
.vibe-veld { margin: 0; display: grid; gap: .35rem; }
.vibe-veld label { font-size: .82rem; font-weight: 600; color: var(--vibe-muted, #56617c); }
.vibe-veld input, .vibe-veld select { font: inherit; color: var(--vibe-fg, #0f1b38); background: var(--vibe-bg, #f4f6fa); border: 1px solid var(--vibe-line, #d5dbe7); border-radius: 8px; padding: .6rem .7rem; width: 100%; box-sizing: border-box; min-height: 44px; }
.vibe-veld-rij { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.vibe-datumcheck__knop { cursor: pointer; border: 0; width: 100%; min-height: 44px; }
.vibe-datumcheck__noot { margin: 0; font-size: .82rem; color: var(--vibe-muted, #56617c); }
.vibe-leeg-tekst { color: var(--vibe-muted, #56617c); font-style: italic; }
