/* =====================================================================
   Chimeo portaal/beheer-thema
   Stemt de Bootstrap-pagina's (portaal, beheer, auth) af op de homepage:
   zelfde kleuren, typografie, kaarten, knoppen en accenten — maar rustig
   en praktisch (geen bewegende/dynamische elementen).
   Huisstijl identiek aan public/css/home.css.
   ===================================================================== */
:root {
    --chimeo-navy: #1F2965;
    --chimeo-navy-900: #141a33;
    --chimeo-teal: #16B0B6;
    --chimeo-teal-600: #118f94;
    --chimeo-teal-050: #e5f6f7;
    --chimeo-ink: #1d2333;
    --chimeo-muted: #5b6478;
    --chimeo-line: #e7eaf0;
    --chimeo-bg-soft: #f5f7fb;

    --bs-link-color-rgb: 31, 41, 101;
    --bs-link-hover-color-rgb: 17, 143, 148;
    --bs-border-color: var(--chimeo-line);
    --bs-border-color-translucent: var(--chimeo-line);
}

/* ---- Basis ---- */
body {
    font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: var(--chimeo-ink);
    -webkit-font-smoothing: antialiased;
}
body.bg-light { background-color: var(--chimeo-bg-soft) !important; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 { color: var(--chimeo-navy); letter-spacing: -.015em; font-weight: 700; }
.text-navy { color: var(--chimeo-navy) !important; }
.text-teal { color: var(--chimeo-teal-600) !important; }
.text-muted { color: var(--chimeo-muted) !important; }
a { color: var(--chimeo-navy); }
a:hover { color: var(--chimeo-teal-600); }

/* ---- Tabbladen (nav-underline in portal/admin) ---- */
.nav-underline { --bs-nav-underline-gap: 1.25rem; border-bottom-color: var(--chimeo-line) !important; }
.nav-underline .nav-link { color: var(--chimeo-muted); font-weight: 500; border-bottom-width: 2px; }
.nav-underline .nav-link:hover { color: var(--chimeo-navy); }
.nav-underline .nav-link.active { color: var(--chimeo-navy) !important; font-weight: 600; border-bottom-color: var(--chimeo-teal); }

/* ---- Kaarten ---- */
.card {
    border: 1px solid var(--chimeo-line);
    border-radius: 14px;
    box-shadow: 0 1px 2px rgba(31, 41, 101, .04);
}
.card.shadow-sm { box-shadow: 0 10px 30px -24px rgba(31, 41, 101, .35) !important; }
.card-header {
    background: #fff;
    border-bottom: 1px solid var(--chimeo-line);
    font-weight: 700;
    color: var(--chimeo-navy);
    padding: 1rem 1.25rem;
}
.card-body { padding: 1.25rem; }

/* ---- Knoppen ---- */
.btn { --bs-btn-border-radius: .625rem; font-weight: 600; }
.btn-sm { --bs-btn-border-radius: .5rem; }
.btn-chimeo {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--chimeo-navy);
    --bs-btn-border-color: var(--chimeo-navy);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--chimeo-teal);
    --bs-btn-hover-border-color: var(--chimeo-teal);
    --bs-btn-active-bg: var(--chimeo-teal-600);
    --bs-btn-active-border-color: var(--chimeo-teal-600);
}
.btn-outline-chimeo {
    --bs-btn-color: var(--chimeo-navy);
    --bs-btn-border-color: var(--chimeo-line);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--chimeo-navy);
    --bs-btn-hover-border-color: var(--chimeo-navy);
    --bs-btn-active-bg: var(--chimeo-navy);
    --bs-btn-active-border-color: var(--chimeo-navy);
}
/* Bootstrap-primary meebewegen met de huisstijl */
.btn-primary {
    --bs-btn-bg: var(--chimeo-navy);
    --bs-btn-border-color: var(--chimeo-navy);
    --bs-btn-hover-bg: var(--chimeo-teal);
    --bs-btn-hover-border-color: var(--chimeo-teal);
    --bs-btn-active-bg: var(--chimeo-teal-600);
    --bs-btn-active-border-color: var(--chimeo-teal-600);
}

/* ---- Tabellen ---- */
/* Losse tabellen (class bg-white, direct op de pagina) in kaartstijl: afgerond, lichte rand,
   zachte kopregel. Tabellen binnen een kaart (zonder bg-white) blijven vlak. */
.table.bg-white {
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--chimeo-line);
    border-radius: 14px;
    overflow: hidden;
}
.table.bg-white > thead > tr > * { background-color: var(--chimeo-bg-soft); }
.table.bg-white > tbody > tr:last-child > * { border-bottom-width: 0; }
.table { --bs-table-border-color: var(--chimeo-line); }
.table > thead th {
    color: var(--chimeo-navy);
    font-weight: 700;
    font-size: .82rem;
    letter-spacing: .01em;
    border-bottom: 1px solid var(--chimeo-line);
}
.table > tbody td { border-color: var(--chimeo-line); }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: var(--chimeo-teal-050); }

/* ---- Formulieren ---- */
.form-label { color: var(--chimeo-navy); font-weight: 600; font-size: .9rem; }
.form-control, .form-select {
    border-color: var(--chimeo-line);
    border-radius: .625rem;
}
.form-control:focus, .form-select:focus {
    border-color: var(--chimeo-teal);
    box-shadow: 0 0 0 .25rem rgba(22, 176, 182, .2);
}

/* ---- Badges (zachte, afgeronde pills in huisstijl) ---- */
.badge { font-weight: 600; border-radius: 20px; padding: .35em .7em; letter-spacing: .01em; }
.badge.text-bg-info    { background-color: var(--chimeo-teal-050) !important; color: var(--chimeo-teal-600) !important; }
.badge.text-bg-primary { background-color: #e9edf8 !important; color: var(--chimeo-navy) !important; }
.badge.text-bg-success { background-color: #e4f7ee !important; color: #1b8a5a !important; }
.badge.text-bg-warning { background-color: #fff3e0 !important; color: #b4740b !important; }
.badge.text-bg-danger  { background-color: #fde8e8 !important; color: #c0392b !important; }
.badge.text-bg-secondary { background-color: #eef0f5 !important; color: var(--chimeo-muted) !important; }

/* ---- Alerts (zachter, afgerond) ---- */
.alert { border-radius: 12px; border: 1px solid var(--chimeo-line); }
.alert-info { background: var(--chimeo-teal-050); border-color: #cdeef0; color: #0f6b70; }

/* ---- Overig ---- */
.nav-pills .nav-link.active.bg-chimeo { background-color: var(--chimeo-navy); }
hr { border-color: var(--chimeo-line); opacity: 1; }

/* =====================================================================
   Aanvullingen na themacontrole (2026-10-04)
   Bootstrap-onderdelen die nog hun standaardblauw/-geel hadden of nog niet
   in de huisstijl stonden: links, vinkjes/schakelaars, pills, paginering,
   zachte alerts en statusknoppen. Kleuren gelijk aan de zachte badges.
   ===================================================================== */
:root {
    --bs-primary: #1F2965;
    --bs-primary-rgb: 31, 41, 101;
    --bs-link-color: #1F2965;
    --bs-link-hover-color: #118f94;
}

/* Linkknoppen ("Annuleren", "Terug") */
.btn-link {
    --bs-btn-color: var(--chimeo-navy);
    --bs-btn-hover-color: var(--chimeo-teal-600);
    --bs-btn-active-color: var(--chimeo-teal-600);
}

/* Vinkjes, radio's en schakelaars */
.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate { background-color: var(--chimeo-navy); border-color: var(--chimeo-navy); }
.form-check-input:focus { border-color: var(--chimeo-teal); box-shadow: 0 0 0 .25rem rgba(22, 176, 182, .2); }
.form-switch .form-check-input:focus:not(:checked) {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2316B0B6'/%3e%3c/svg%3e");
}

/* Kleine omlijnde vakjes (modules): zelfde afronding als velden en knoppen */
.rounded { border-radius: .625rem !important; }

/* Pills (filters in beheer): rustig, actief navy */
.nav-pills .nav-link { color: var(--chimeo-muted); font-weight: 500; border-radius: .625rem; }
.nav-pills .nav-link:hover { color: var(--chimeo-navy); }
.nav-pills .nav-link.active { background-color: var(--chimeo-navy); color: #fff; }

/* Paginering */
.pagination {
    --bs-pagination-color: var(--chimeo-navy);
    --bs-pagination-hover-color: var(--chimeo-navy);
    --bs-pagination-hover-bg: var(--chimeo-teal-050);
    --bs-pagination-hover-border-color: var(--chimeo-line);
    --bs-pagination-focus-color: var(--chimeo-navy);
    --bs-pagination-focus-bg: var(--chimeo-teal-050);
    --bs-pagination-focus-box-shadow: 0 0 0 .25rem rgba(22, 176, 182, .2);
    --bs-pagination-active-bg: var(--chimeo-navy);
    --bs-pagination-active-border-color: var(--chimeo-navy);
    --bs-pagination-border-color: var(--chimeo-line);
    --bs-pagination-border-radius: .625rem;
}

/* Alerts: zachte varianten, zelfde palet als de badges */
.alert-success { background: #e4f7ee; border-color: #c6ecd9; color: #14694a; }
.alert-warning { background: #fff3e0; border-color: #f6dfb8; color: #8a5a08; }
.alert-danger  { background: #fde8e8; border-color: #f6c9c9; color: #9d2b20; }
.alert-light   { background: #fff; border-color: var(--chimeo-line); color: var(--chimeo-ink); }

/* Statusknoppen (schorsen / heractiveren / intrekken): tekstkleuren van de badges
   (geel #ffc107 was op wit nauwelijks leesbaar) */
.btn-outline-warning, .btn-outline-danger, .btn-outline-success {
    --bs-btn-hover-color: #fff;
    --bs-btn-active-color: #fff;
}
.btn-outline-warning { --bs-btn-color: #b4740b; --bs-btn-border-color: #ecd0a0; --bs-btn-hover-bg: #b4740b; --bs-btn-hover-border-color: #b4740b; --bs-btn-active-bg: #b4740b; --bs-btn-active-border-color: #b4740b; }
.btn-outline-danger  { --bs-btn-color: #c0392b; --bs-btn-border-color: #f0b8b2; --bs-btn-hover-bg: #c0392b; --bs-btn-hover-border-color: #c0392b; --bs-btn-active-bg: #c0392b; --bs-btn-active-border-color: #c0392b; }
.btn-outline-success { --bs-btn-color: #1b8a5a; --bs-btn-border-color: #b5e2cd; --bs-btn-hover-bg: #1b8a5a; --bs-btn-hover-border-color: #1b8a5a; --bs-btn-active-bg: #1b8a5a; --bs-btn-active-border-color: #1b8a5a; }
.btn-outline-warning:disabled, .btn-outline-danger:disabled, .btn-outline-success:disabled { opacity: .5; }

/* "inbegrepen"-label e.d. */
.badge.text-bg-light { background-color: #eef0f5 !important; color: var(--chimeo-muted) !important; }
