/* PlanMail - merklaag boven Bootstrap 5.
   Bootstrap's eigen CSS-variabelen worden hier overschreven zodat kleur en
   typografie overal automatisch doorwerken (knoppen, links, focus-states),
   zonder dat losse Bootstrap-componenten overschreven hoeven te worden. */

:root {
    --bs-primary: #15203B;
    --bs-primary-rgb: 21, 32, 59;
    --bs-link-color: #C8553D;
    --bs-link-color-rgb: 200, 85, 61;
    --bs-link-hover-color: #9c3f2c;
    --bs-link-hover-color-rgb: 156, 63, 44;
    --bs-body-bg: #F1F3F5;
    --bs-body-font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;
    --bs-border-radius: .6rem;
    --bs-border-radius-lg: .75rem;
    --bs-border-radius-sm: .4rem;
}

.btn-primary {
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: #C8553D;
    --bs-btn-hover-border-color: #C8553D;
    --bs-btn-active-bg: #a8442f;
    --bs-btn-active-border-color: #a8442f;
}

.brand-font {
    font-family: 'Space Grotesk', 'Segoe UI', system-ui, sans-serif;
}

/* Signatuurelement: een 'postzegel'-stip naast de merknaam, passend bij een
   mailplatform. Bewust klein en terughoudend gehouden. */
.brand-mark {
    display: inline-block;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 2px dashed #C8553D;
    flex-shrink: 0;
}

@media (prefers-reduced-motion: reduce) {
    * {
        transition: none !important;
    }
}