/* ---
CloX Website: Specifieke Stijlen
Kleuren gebaseerd op de app:
Oranje (Accent): #B85E00
Donker (Basis):  #212529
--- */

:root {
    --color-primary: #B85E00;   /* Het kenmerkende CloX oranje */
    --color-secondary: #212529; /* Donkergrijs/Zwart voor de nacht-vibe */
    --color-accent: #f08d00;    /* Iets lichter oranje voor interactie */
    --color-text: #333;
    --color-text-light: #555;
    --color-text-on-dark: #ffffff;
}

/* Zorg dat de hero-sectie en koppen het juiste oranje gebruiken */
.text-warning, .text-primary {
    color: var(--color-primary) !important;
}

.border-bottom.border-warning {
    border-color: var(--color-primary) !important;
}

/* De knoppen moeten ook in CloX-stijl */
.btn-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn-primary:hover {
    background-color: var(--color-accent);
    border-color: var(--color-accent);
}

.bg-light {
    background-color: #fcfcfc !important;
}

/* Pas de footer aan naar de donkere CloX kleur */
.footer {
    background-color: var(--color-secondary);
    color: rgba(255, 255, 255, 0.8);
    border-top: 2px solid var(--color-primary);
}