/* FAAM-chat: helpdesk en klantenportaal. */
.fc { --fc-diep: #22332A; --fc-groen: #4F6B5B; --fc-mint: #EDF3EF; --fc-creme: #FFFCF6; --fc-rand: #E8DCC6; --fc-oker: #EEBE75; --fc-zacht: #56665C; position: fixed; right: 20px; bottom: 20px; z-index: 9990; font: inherit; color: var(--fc-diep); }
.fc *, .fc *::before, .fc *::after { box-sizing: border-box; }
.fc-sr, .fc-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.fc button, .fc input, .fc textarea { font: inherit; }
.fc-open { display: inline-flex; align-items: center; gap: 8px; min-height: 52px; padding: 0 20px 0 16px; border-radius: 999px; border: 2px solid var(--fc-diep); background: var(--fc-diep); color: #fff; font-weight: 700; font-size: 15px; cursor: pointer; box-shadow: 0 8px 24px rgba(34, 51, 42, .22); }
.fc-open:hover { background: var(--fc-groen); border-color: var(--fc-groen); }
.fc-open:focus-visible, .fc button:focus-visible, .fc input:focus-visible, .fc textarea:focus-visible, .fc a:focus-visible { outline: 3px solid var(--fc-oker); outline-offset: 2px; }
.fc.is-open .fc-open { display: none; }
.fc-paneel { position: absolute; right: 0; bottom: 0; width: min(400px, calc(100vw - 32px)); height: min(600px, calc(100vh - 40px)); display: flex; flex-direction: column; background: var(--fc-creme); border: 2px solid var(--fc-diep); border-radius: 22px; box-shadow: 0 18px 48px rgba(34, 51, 42, .25); overflow: hidden; }
.fc-paneel[hidden] { display: none; }
.fc-kop { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 14px 16px; background: var(--fc-diep); color: #fff; }
.fc-kop strong { display: block; font-size: 16px; }
.fc-kop small { display: block; font-size: 12.5px; line-height: 1.4; opacity: .85; margin-top: 2px; }
.fc-dicht { flex: none; width: 36px; height: 36px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .14); color: #fff; font-size: 22px; line-height: 1; cursor: pointer; }
.fc-dicht:hover { background: rgba(255, 255, 255, .26); }
.fc-berichten { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.fc-bericht { max-width: 92%; padding: 10px 13px; border-radius: 16px; font-size: 14.5px; line-height: 1.5; }
.fc-bericht p { margin: 0 0 6px; }
.fc-bericht p:last-child { margin-bottom: 0; }
.fc-bericht.is-bot { align-self: flex-start; background: #fff; border: 1px solid var(--fc-rand); border-bottom-left-radius: 6px; }
.fc-bericht.is-jij { align-self: flex-end; background: var(--fc-groen); color: #fff; border-bottom-right-radius: 6px; }
.fc-label { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--fc-groen); margin-top: 6px !important; }
.fc-zacht { color: var(--fc-zacht); }
.fc-vraag { font-weight: 700; margin-top: 8px !important; }
.fc-kaart { display: flex; flex-direction: column; gap: 3px; margin: 6px 0; padding: 10px 12px; border: 1px solid var(--fc-rand); border-radius: 12px; background: var(--fc-creme); color: var(--fc-diep); text-decoration: none; }
.fc-kaart:hover { background: var(--fc-mint); }
.fc-kaart strong { font-size: 14.5px; }
.fc-kaart span { font-size: 13.5px; }
.fc-lees { font-weight: 700; color: var(--fc-groen); text-decoration: underline; }
.fc-link { font-weight: 700; color: var(--fc-groen); }
.fc-knoppen { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.fc-chip { border: 1.5px solid var(--fc-diep); background: #fff; color: var(--fc-diep); border-radius: 999px; padding: 6px 12px; font-size: 13.5px; font-weight: 600; cursor: pointer; text-align: left; }
.fc-chip:hover { background: var(--fc-mint); }
.fc-chip:disabled { opacity: .45; cursor: default; }
.fc-vorm { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--fc-rand); background: #fff; }
.fc-vorm input { flex: 1; min-width: 0; min-height: 44px; padding: 8px 14px; border: 1.5px solid var(--fc-rand); border-radius: 999px; background: var(--fc-creme); color: var(--fc-diep); font-size: 16px; }
.fc-vorm button, .fc-mens button { min-height: 44px; padding: 0 18px; border-radius: 999px; border: 0; background: var(--fc-diep); color: #fff; font-weight: 700; cursor: pointer; }
.fc-vorm button:hover, .fc-mens button:hover { background: var(--fc-groen); }
.fc-mens { display: flex; flex-direction: column; gap: 8px; }
.fc-mens label { display: flex; flex-direction: column; gap: 3px; font-size: 13px; font-weight: 700; }
.fc-mens input, .fc-mens textarea { padding: 8px 11px; border: 1.5px solid var(--fc-rand); border-radius: 10px; background: var(--fc-creme); color: var(--fc-diep); font-size: 16px; font-weight: 400; }
.fc-mens button:disabled { opacity: .6; }
.fc-klein { font-size: 12px; color: var(--fc-zacht); }
.fc-klein a { color: inherit; }
.fc-fout { color: #8A2A1A; font-size: 13px; font-weight: 600; }
@media (max-width: 520px) {
	.fc { right: 12px; bottom: 12px; }
	.fc.is-open { left: 0; right: 0; top: 0; bottom: 0; }
	.fc-paneel { position: fixed; inset: 0; width: 100%; height: 100%; border-radius: 0; border: 0; }
}
@media print { .fc { display: none; } }