/* Feedback in sterren — gedeelde module. Bron: 1_Ondernemen/Gedeeld/feedback/.
   Kleuren en lettertype komen uit variabelen die de site zet op .fbs of hoger:
   --fbs-accent, --fbs-accent-donker, --fbs-accent-licht, --fbs-tekst,
   --fbs-vlak (rustige achtergrond), --fbs-kop-font. */
.fbs { --fbs-lijn: rgba(44, 44, 44, .11); color: var(--fbs-tekst, #2c2c2c); }
.fbs [hidden] { display: none !important; }
.fbs-kaart { padding: clamp(1.25rem, 4vw, 2.5rem); border: 1px solid var(--fbs-lijn); border-radius: 2rem; background: #fff; box-shadow: 0 16px 40px rgba(44, 44, 44, .055); }
.fbs-laden { font-size: .9rem; font-weight: 700; color: rgba(44, 44, 44, .55); }
.fbs-kop { margin: 0; font-family: var(--fbs-kop-font, inherit); font-size: 1.3rem; font-weight: 900; }
.fbs-tekst { margin: .5rem 0 0; color: rgba(44, 44, 44, .7); font-size: .95rem; line-height: 1.6; }
.fbs-knop { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1.2rem; padding: .9rem 2rem; border: 0; border-radius: 999px; background: var(--fbs-accent, #00a676); color: #fff; font: inherit; font-weight: 800; text-decoration: none; cursor: pointer; }
.fbs-knop:disabled { opacity: .6; cursor: wait; }
.fbs-link { padding: 0; border: 0; background: none; color: var(--fbs-accent-donker, #007a57); font: inherit; font-weight: 800; text-decoration: underline; cursor: pointer; }
.fbs-kies-lijst { display: grid; gap: .6rem; margin-top: 1.1rem; }
.fbs-kies-item { display: flex; align-items: center; justify-content: space-between; gap: 1rem; width: 100%; padding: .95rem 1.1rem; border: 1px solid var(--fbs-lijn); border-radius: 1rem; background: #fff; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: border-color .2s, background-color .2s; }
.fbs-kies-item:hover, .fbs-kies-item:focus-visible { border-color: var(--fbs-accent, #00a676); background: var(--fbs-accent-licht, #e6f6f0); outline: none; }
.fbs-kies-item strong { display: block; font-size: 1rem; font-weight: 800; }
.fbs-kies-item span { display: block; margin-top: .15rem; color: rgba(44, 44, 44, .62); font-size: .85rem; font-weight: 600; }
.fbs-kies-item .fbs-pijl { margin: 0; color: var(--fbs-accent-donker, #007a57); font-size: 1.2rem; font-weight: 800; }
.fbs-kies-algemeen { margin-top: 1.3rem; }
.fbs-form { display: flex; flex-direction: column; }
.fbs-onderwerp { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1rem; margin-bottom: 1.6rem; padding: .9rem 1.1rem; border-radius: 1.1rem; background: var(--fbs-vlak, #f8f5ee); }
.fbs-onderwerp-label { display: block; color: rgba(44, 44, 44, .6); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.fbs-onderwerp-titel { display: block; font-family: var(--fbs-kop-font, inherit); font-size: 1.15rem; font-weight: 900; }
.fbs-vraag { min-width: 0; margin: 0 0 1.9rem; padding: 0 0 1.9rem; border: 0; border-bottom: 1px solid var(--fbs-lijn); }
.fbs-vraag legend { width: 100%; margin: 0 0 .95rem; padding: 0; font-family: var(--fbs-kop-font, inherit); font-size: 1.2rem; font-weight: 900; line-height: 1.35; }
.fbs-optioneel { color: rgba(44, 44, 44, .58); font-size: .9rem; font-weight: 500; }
.fbs-hint { margin: -.4rem 0 1rem; color: rgba(44, 44, 44, .64); font-size: .9rem; line-height: 1.5; }
.fbs-opties { display: grid; gap: .15rem; }
.fbs-optie { display: flex; align-items: center; gap: .75rem; min-height: 3.15rem; padding: .68rem .85rem; border: 1px solid transparent; border-bottom-color: var(--fbs-lijn); border-radius: .75rem; background: #fff; font-size: .92rem; font-weight: 700; line-height: 1.4; cursor: pointer; transition: border-color .2s, background-color .2s, color .2s; }
.fbs-optie:hover { border-color: var(--fbs-accent, #00a676); }
.fbs-optie:has(input:checked) { border-color: var(--fbs-accent, #00a676); background: var(--fbs-accent-licht, #e6f6f0); color: var(--fbs-accent-donker, #007a57); }
.fbs-optie input { appearance: none; display: grid; place-items: center; flex: none; width: 1.25rem; height: 1.25rem; margin: 0; border: 2px solid rgba(44, 44, 44, .38); border-radius: .35rem; background: #fff; cursor: pointer; }
.fbs-optie input[type="radio"] { border-radius: 50%; }
.fbs-optie input:checked { border-color: var(--fbs-accent, #00a676); background: var(--fbs-accent, #00a676); }
.fbs-optie input:checked::after { content: '✓'; color: #fff; font-family: sans-serif; font-size: .82rem; font-weight: 900; line-height: 1; }
.fbs-optie input:focus-visible { outline: 3px solid var(--fbs-accent-donker, #007a57); outline-offset: 3px; }
.fbs-sterren-blok { padding: 1.2rem 1.3rem; border-radius: 1.2rem; background: var(--fbs-vlak, #f8f5ee); }
.fbs-sterren-titel { display: block; font-family: var(--fbs-kop-font, inherit); font-size: 1.15rem; font-weight: 900; }
.fbs-klein { margin: .3rem 0 0; color: rgba(44, 44, 44, .7); font-size: .88rem; line-height: 1.5; }
.fbs-sterren { display: flex; flex-wrap: wrap; align-items: center; gap: .15rem; margin-top: .6rem; }
.fbs-sterren-rij { display: flex; }
.fbs-ster { position: relative; display: block; width: 2.6rem; height: 2.6rem; transition: transform .15s; }
.fbs-ster:hover { transform: scale(1.1); }
.fbs-ster-glyph, .fbs-ster-vol { position: absolute; inset: 0; color: rgba(44, 44, 44, .2); font-size: 2.4rem; line-height: 2.6rem; text-align: center; pointer-events: none; }
.fbs-ster-vol { color: #f2a900; clip-path: inset(0 100% 0 0); }
.fbs-ster.is-half .fbs-ster-vol { clip-path: inset(0 50% 0 0); }
.fbs-ster.is-aan .fbs-ster-vol { clip-path: none; }
.fbs-ster label { position: absolute; top: 0; bottom: 0; width: 50%; cursor: pointer; }
.fbs-ster label:first-of-type { left: 0; }
.fbs-ster label:last-of-type { right: 0; }
.fbs-ster input, .fbs-ster-geen input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.fbs-ster:focus-within { outline: 3px solid var(--fbs-accent-donker, #007a57); outline-offset: 2px; border-radius: .4rem; }
.fbs-ster-geen { position: relative; margin-left: .8rem; padding: .3rem .7rem; border: 1px solid var(--fbs-lijn); border-radius: 999px; background: #fff; color: rgba(44, 44, 44, .7); font-size: .82rem; font-weight: 800; cursor: pointer; }
.fbs-ster-geen:has(input:checked) { border-color: rgba(44, 44, 44, .5); color: inherit; }
.fbs-ster-geen:focus-within { outline: 3px solid var(--fbs-accent-donker, #007a57); outline-offset: 2px; }
.fbs-sterren-uitleg { margin: .5rem 0 0; font-size: .92rem; font-weight: 700; line-height: 1.5; }
.fbs-sterren-blok + div > .fbs-vraag:first-child { margin-top: 1.9rem; }
.fbs-slot { margin-top: 1.9rem; padding: 1.4rem; border: 1px solid var(--fbs-lijn); border-radius: 1.25rem; background: var(--fbs-accent-licht, #e6f6f0); }
.fbs-slot-label { display: block; margin-bottom: .75rem; font-family: var(--fbs-kop-font, inherit); font-size: 1.15rem; font-weight: 900; line-height: 1.4; }
.fbs-slot textarea, .fbs-citeernaam input { display: block; width: 100%; padding: .8rem 1rem; border: 1px solid var(--fbs-lijn); border-radius: .9rem; background: #fff; color: inherit; font: inherit; box-sizing: border-box; }
.fbs-slot textarea { min-height: 8rem; resize: vertical; }
.fbs-slot textarea:focus, .fbs-citeernaam input:focus { border-color: var(--fbs-accent, #00a676); outline: 3px solid var(--fbs-accent-licht, #e6f6f0); }
.fbs-citeer { display: flex; align-items: flex-start; gap: .6rem; margin-top: 1.1rem; font-size: .92rem; font-weight: 700; cursor: pointer; }
.fbs-citeer input { flex: none; width: 1.15rem; height: 1.15rem; margin-top: .15rem; accent-color: var(--fbs-accent, #00a676); }
.fbs-citeernaam { margin-top: .8rem; }
.fbs-citeernaam label { display: block; margin-bottom: .45rem; font-size: .9rem; font-weight: 800; }
.fbs-tegoed { display: flex; align-items: flex-start; gap: .9rem; margin-top: 1.8rem; padding: 1.1rem 1.2rem; border-radius: 1.1rem; background: var(--fbs-accent-licht, #e6f6f0); }
.fbs-tegoed-teken { display: grid; place-items: center; flex: none; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--fbs-accent, #00a676); color: #fff; font-size: .88rem; font-weight: 900; }
.fbs-tegoed strong { display: block; margin-bottom: .2rem; color: var(--fbs-accent-donker, #007a57); font-size: .96rem; font-weight: 800; }
.fbs-tegoed span { display: block; color: rgba(44, 44, 44, .72); font-size: .88rem; line-height: 1.55; }
.fbs-fout { margin-top: 1.3rem; padding: .9rem 1rem; border: 1px solid #fecaca; border-radius: .85rem; background: #fef2f2; color: #b91c1c; font-size: .9rem; font-weight: 700; }
.fbs-acties { margin-top: .4rem; }
@media (max-width: 599px) { .fbs-kaart { border-radius: 1.5rem; } .fbs-acties .fbs-knop, .fbs-acties button { width: 100%; justify-content: center; } }
.fbs-review { margin-top: 1.4rem; padding: 1.4rem; border: 1px solid var(--fbs-lijn); border-radius: 1.25rem; background: #fff; }
.fbs-review .fbs-hint { margin: .35rem 0 .8rem; }
.fbs-review textarea { display: block; width: 100%; min-height: 5.5rem; padding: .8rem 1rem; border: 1px solid var(--fbs-lijn); border-radius: .9rem; background: #fff; color: inherit; font: inherit; resize: vertical; box-sizing: border-box; }
.fbs-review textarea:focus { border-color: var(--fbs-accent, #00a676); outline: 3px solid var(--fbs-accent-licht, #e6f6f0); }
.fbs-teller { display: block; margin-top: .3rem; color: rgba(44, 44, 44, .55); font-size: .78rem; font-weight: 700; text-align: right; }

/* Reviewblok op de homepage (reviews-blok.js). */
.fbr[hidden] { display: none !important; }
.fbr { padding: 3rem 1.25rem; color: var(--fbs-tekst, #2c2c2c); }
.fbr-binnen { max-width: 1100px; margin: 0 auto; }
.fbr-kop { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 1.5rem; margin-bottom: 1.4rem; }
.fbr-titel { margin: 0; font-family: var(--fbs-kop-font, inherit); font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 900; line-height: 1.2; }
.fbr-gemiddelde { display: flex; align-items: center; gap: .5rem; margin: 0; font-weight: 800; }
.fbr-lijst { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.fbr-kaart { margin: 0; padding: 1.4rem; border: 1px solid rgba(44, 44, 44, .1); border-radius: 1.4rem; background: #fff; display: flex; flex-direction: column; gap: .7rem; }
.fbr-tekst { margin: 0; font-size: 1.02rem; line-height: 1.6; }
.fbr-wie { margin-top: auto; color: rgba(44, 44, 44, .65); font-size: .9rem; font-weight: 800; }
.fbr-sterren { display: inline-flex; gap: .05rem; }
.fbr-ster { position: relative; color: rgba(44, 44, 44, .2); font-size: 1.15rem; line-height: 1; }
.fbr-ster.is-aan { color: #f2a900; }
.fbr-ster.is-half { background: linear-gradient(90deg, #f2a900 50%, rgba(44, 44, 44, .2) 50%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.fbr-noot { margin: 1rem 0 0; color: rgba(44, 44, 44, .6); font-size: .82rem; line-height: 1.5; }