/*
 * Huisstijl van de klant. Dit is het enige CSS-bestand dat per klant wordt
 * aangepast; css/styles.css en css/datepicker.css gebruiken alleen deze tokens.
 * De waarden hieronder zijn neutrale placeholders.
 */
:root {
    /* Accentkleur: primaire knoppen (Volgende, Bevestig), geselecteerd tijdslot */
    --primary-btn-color: #0f766e;
    --primary-btn-color-hover: #115e59;

    /* Hoofdkleur: hero-balk, secundaire knoppen, kalender */
    --secondary-btn-color: #334155;
    --secondary-btn-color-hover: #475569;

    /* Tekstkleuren voor titels en donkere accenten */
    --standard-title-color: #1e293b;
    --text-dark: #0f172a;

    /* Lichte achtergrond van tegels en kaarten */
    --surface-color: #f1f5f9;

    /* Lettertype. Voor een eigen font: @font-face hier toevoegen en de naam vooraan zetten. */
    --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

    /* Decoratief patroon in de hero-balk; `none` om uit te zetten */
    --hero-pattern: url("../img/plus-bg.svg");
}