/* Netron recolor over Volt (Bootstrap 5). Primary purple naar Netron blue #1833FF */
:root {
    --bs-primary: #1833FF;
    --bs-primary-rgb: 24, 51, 255;
    --bs-link-color: #1833FF;
    --bs-link-hover-color: #1429d9;
}

/* Poppins as the portal typeface (overrides Volt) */
body, .btn, .form-control, .form-select, .nav-link, .dropdown-menu, .badge,
input, textarea, select, button, .table {
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .navbar-brand, .fw-extrabold, .fw-bolder {
    font-family: 'Poppins', sans-serif !important;
    letter-spacing: -0.01em;
}

/* Sidebar Netron logo (white wordmark on dark) */
.sidebar-logo { height: 40px; width: auto; display: block; }

/* Buttons */
.btn-primary { background-color: #1833FF; border-color: #1833FF; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active { background-color: #1429d9 !important; border-color: #1429d9 !important; }
.btn-outline-primary { color: #1833FF; border-color: #1833FF; }
.btn-outline-primary:hover { background-color: #1833FF; border-color: #1833FF; }

/* Accents */
a { color: #1833FF; }
a:hover { color: #1429d9; }
.text-primary { color: #1833FF !important; }
.bg-primary { background-color: #1833FF !important; }
.bg-soft { background-color: #f0f2fb !important; }

/* Sidebar. Netron dark navy with blue active state */
.sidebar { background: #0b1122 !important; }
.sidebar .sidebar-inner { min-height: 100vh; }
.sidebar .nav-link { color: #eef1f9 !important; border-radius: .55rem; padding: .62rem .8rem; margin-bottom: .18rem; font-weight: 600; }
.sidebar .nav-link:hover { color: #fff !important; background: #1b2647; }
.sidebar .nav-item.active > .nav-link { background: #1833FF !important; color: #fff !important; box-shadow: 0 8px 18px -8px rgba(24,51,255,.75); }
.sidebar .sidebar-icon { display: inline-flex; width: 1.4rem; margin-right: .7rem; text-align: center; color: #aab4d6; }
.sidebar .nav-link:hover .sidebar-icon,
.sidebar .nav-item.active .sidebar-icon { color: #fff; }
.border-gray-700 { border-color: #263054 !important; }
.text-gray-400 { color: #aab4d0 !important; }

/* Sticky footer: content fills the height, footer sits at the very bottom */
.content { display: flex; flex-direction: column; min-height: 100vh; }
.content-body { flex: 1 0 auto; }
.portal-foot { margin-top: auto; text-align: center; color: #9aa1b4; font-size: 12.5px; padding: 16px 20px; border-top: 1px solid #eceff6; background: #fff; }

/* Brand mark */
.brand-mark { width: 34px; height: 34px; background: #1833FF; }

/* KPI icon tiles + avatar */
.icon-shape { width: 2.75rem; height: 2.75rem; display: inline-flex; align-items: center; justify-content: center; border-radius: .6rem; font-size: 1.1rem; }
.icon-shape-primary { background: rgba(24,51,255,.10); color: #1833FF; }
.icon-shape-secondary { background: rgba(11,17,34,.07); color: #0b1122; }
.avatar-initials { width: 38px; height: 38px; background: #1833FF; font-size: 13px; }

/* Nog te bouwen modules: gedempt tonen met een label, niet klikbaar */
.sidebar .sidebar-soon { color: #7d88ab !important; cursor: default; font-weight: 600; }
.sidebar .sidebar-soon:hover { background: transparent; color: #7d88ab !important; }
.sidebar .sidebar-soon .sidebar-icon { color: #4c5678; }
.soon-badge { font-size: 9px; letter-spacing: .05em; text-transform: uppercase; background: rgba(255,255,255,.09); color: #c7cee6; padding: 2px 7px; border-radius: 999px; font-weight: 700; }
.soon-pill { display: inline-block; font-size: 11px; font-weight: 700; letter-spacing: .02em; color: #1833FF; background: rgba(24,51,255,.10); padding: 4px 10px; border-radius: 999px; }

/* Content spacing when sidebar is fixed (Volt handles layout; keep sane on desktop) */
@media (min-width: 992px) {
    .content { margin-left: 260px; }
    .sidebar { width: 260px; position: fixed; top: 0; left: 0; height: 100vh; z-index: 100; }
}
