:root {
	    --tblr-primary: #003d7a;
	    --tblr-primary-rgb: 0, 61, 122;
	    --tblr-primary-darken: #002b55;
	    --tblr-primary-lt: #e5f0fa;

	    /* Links alinhados com a marca */
	    --tblr-link-color: #0052a3;
	    --tblr-link-color-rgb: 0, 82, 163;
	    --tblr-link-hover-color: #003d7a;
}

/* ACTIVE (LIGHT) – mesma ideia do dark: highlight suave, sem “chapado” */
.navbar-nav .nav-link.active,
.navbar-nav .nav-link[aria-expanded="true"],
.dropdown-item.active,
.dropdown-item:active {
	    color: var(--tblr-primary);
	    background-color: color-mix(in srgb, var(--tblr-primary) 14%, transparent);
	    border: 1px solid color-mix(in srgb, var(--tblr-primary) 22%, transparent);
	    border-radius: 10px;
}

/* HEADER (LIGHT) está com fundo escuro igual ao DARK.
 * Então, no LIGHT, usamos o mesmo azul do DARK somente no menu/topbar. */
html[data-bs-theme="light"] header,
html[data-bs-theme="light"] aside.navbar {
	    --tblr-primary: #3b82f6;
	    --tblr-primary-rgb: 59, 130, 246;
}

html[data-bs-theme="light"] header .navbar-nav .nav-link.active,
html[data-bs-theme="light"] header .navbar-nav .nav-link[aria-expanded="true"],
html[data-bs-theme="light"] header .dropdown-menu .dropdown-item.active,
html[data-bs-theme="light"] header .dropdown-menu .dropdown-item:active,
html[data-bs-theme="light"] aside.navbar .navbar-nav .nav-link.active,
html[data-bs-theme="light"] aside.navbar .navbar-nav .nav-link[aria-expanded="true"],
html[data-bs-theme="light"] aside.navbar .dropdown-menu .dropdown-item.active,
html[data-bs-theme="light"] aside.navbar .dropdown-menu .dropdown-item:active {
	    color: #eaf2ff !important;
	    background-color: color-mix(in srgb, var(--tblr-primary) 18%, transparent) !important;
	    border: 0 !important;
	    border-radius: 10px;
}

/* DARK MODE
 * Ajusta o "azul" para ficar mais vivo e legível em fundos escuros,
 * sem perder a identidade visual no modo claro. */
html[data-bs-theme="dark"],
body[data-bs-theme="dark"] {
	    --tblr-primary: #3b82f6;
	    --tblr-primary-rgb: 59, 130, 246;
	    --tblr-primary-darken: #1d4ed8;
	    --tblr-primary-lt: rgba(59, 130, 246, 0.16);

	    --tblr-link-color: #93c5fd;
	    --tblr-link-color-rgb: 147, 197, 253;
	    --tblr-link-hover-color: #bfdbfe;
}

/* Destaque do menu/itens ativos no dark (mais "premium", menos chapado). */
html[data-bs-theme="dark"] .navbar-nav .nav-link.active,
html[data-bs-theme="dark"] .navbar-nav .nav-link[aria-expanded="true"],
html[data-bs-theme="dark"] .dropdown-item.active,
html[data-bs-theme="dark"] .dropdown-item:active {
	    color: #eaf2ff;
	    background-color: color-mix(in srgb, var(--tblr-primary) 18%, transparent);
	    border-radius: 10px;
}

/* Links de ações (lista) mais legíveis no dark. */
html[data-bs-theme="dark"] .table a,
html[data-bs-theme="dark"] .table a:not(.btn) {
	    color: var(--tblr-link-color);
}
html[data-bs-theme="dark"] .table a:hover,
html[data-bs-theme="dark"] .table a:focus {
	    color: var(--tblr-link-hover-color);
}


.expert-logo-wrap img {
	    max-height: 98px;
	    width: auto;
	    display: inline-block;
}

/* LIGHT MODE → só logo normal */
.expert-logo-light {
    display: inline-block !important;
}
.expert-logo-dark {
    display: none !important;
}

/* DARK MODE → inverte: esconde normal, mostra filtrado */
html[data-bs-theme="dark"] .expert-logo-light,
body[data-bs-theme="dark"] .expert-logo-light {
    display: none !important;
}

html[data-bs-theme="dark"] .expert-logo-dark,
body[data-bs-theme="dark"] .expert-logo-dark {
	    display: inline-block !important;
	    filter: brightness(0) invert(1); /* deixa branco */
}

/* Logo no header: no LIGHT o header também é escuro, então forçamos o logo "dark" (branco) ali. */
html[data-bs-theme="light"] header .expert-logo-light,
html[data-bs-theme="light"] aside.navbar .expert-logo-light {
	    display: none !important;
}
html[data-bs-theme="light"] header .expert-logo-dark,
html[data-bs-theme="light"] aside.navbar .expert-logo-dark {
	    display: inline-block !important;
	    filter: brightness(0) invert(1);
}

/* Select2 hover global */
.select2-container--bootstrap .select2-results__option--highlighted[aria-selected] {
	    background: #f3f4f6;
	    color: #111827;
}

/* Select2 hover no dark */
html[data-bs-theme="dark"] .select2-container--bootstrap .select2-results__option--highlighted[aria-selected] {
	    background-color: color-mix(in srgb, var(--tblr-primary) 22%, transparent);
	    color: #e5e7eb;
}

/* ===================================================================
 * AUTH (login/register) – cover split layout
 * =================================================================== */
.expert-auth-cover {
	    min-height: 100vh;
}

.expert-auth-visual {
	    position: relative;
	    background: #0b1220;
	    background-image:
	        linear-gradient(135deg, rgba(11, 18, 32, 0.86), rgba(11, 18, 32, 0.52)),
	        url("/img/auth/auth-bg.svg");
	    background-size: cover;
	    background-position: center;
	    overflow: hidden;
}

.expert-auth-visual-inner {
	    position: relative;
	    z-index: 2;
	    width: 100%;
	    padding: 64px 56px;
	    display: flex;
	    flex-direction: column;
	    gap: 16px;
	    color: #e5e7eb;
}

.expert-auth-person {
	    position: absolute;
	    left: -110px;
	    bottom: -34px;
	    width: clamp(480px, 42vw, 820px);
	    max-width: none;
	    height: auto;
	    z-index: 1;
	    pointer-events: none;
	    user-select: none;
	    opacity: 0.86;
	    filter: drop-shadow(0 22px 44px rgba(0, 0, 0, 0.40));
}

@media (min-width: 1400px) {
	    .expert-auth-person {
	        left: -140px;
	        bottom: -42px;
	        width: clamp(620px, 46vw, 1020px);
	    }
}

.expert-auth-visual-inner {
	    margin-left: clamp(320px, 26vw, 560px);
}

@media (max-width: 1199.98px) {
	    .expert-auth-visual-inner {
	        margin-left: clamp(260px, 26vw, 480px);
	    }
}

.expert-auth-brand .expert-logo-wrap img {
	    max-height: 64px;
}

.expert-auth-title {
	    margin: 12px 0 0;
	    font-weight: 800;
	    letter-spacing: -0.02em;
	    color: #f8fafc;
	    font-size: 2.3rem;
	    line-height: 1.05;
	    max-width: 18ch;
}

.expert-auth-subtitle {
	    margin: 0;
	    color: rgba(226, 232, 240, 0.88);
	    font-size: 1rem;
	    max-width: 52ch;
}

.expert-auth-points {
	    margin-top: 10px;
	    display: grid;
	    gap: 10px;
	    max-width: 56ch;
}

.expert-auth-point {
	    padding: 10px 12px;
	    border-radius: 12px;
	    background: rgba(15, 23, 42, 0.38);
	    border: 1px solid rgba(148, 163, 184, 0.18);
	    backdrop-filter: blur(8px);
}

.expert-auth-footnote {
	    margin-top: auto;
	    color: rgba(226, 232, 240, 0.70);
	    font-size: 0.85rem;
}

.expert-auth-form {
	    background: var(--tblr-bg-surface, #fff);
}

html[data-bs-theme="dark"] .expert-auth-form,
body[data-bs-theme="dark"] .expert-auth-form {
	    background: color-mix(in srgb, var(--tblr-bg-surface, #0b1220), #fff 2%);
}

@media (max-width: 991.98px) {
	    /* Quando o painel esquerdo some (mobile/tablet), aplicamos o SVG no fundo do form. */
	    html[data-bs-theme="light"] .expert-auth-form,
	    body[data-bs-theme="light"] .expert-auth-form {
	        background: #0b1220;
	        background-image:
	            linear-gradient(135deg, rgba(11, 18, 32, 0.88), rgba(11, 18, 32, 0.66)),
	            url("/img/auth/auth-bg.svg");
	        background-size: cover;
	        background-position: center;
	    }
	    html[data-bs-theme="dark"] .expert-auth-form,
	    body[data-bs-theme="dark"] .expert-auth-form {
	        background: #0b1220;
	        background-image:
	            linear-gradient(135deg, rgba(2, 6, 23, 0.92), rgba(2, 6, 23, 0.72)),
	            url("/img/auth/auth-bg.svg");
	        background-size: cover;
	        background-position: center;
	    }
	    .expert-auth-form .card {
	        border-radius: 14px;
	        border-color: rgba(148, 163, 184, 0.18);
	        background: rgba(15, 23, 42, 0.50);
	        backdrop-filter: blur(10px);
	    }
	    .expert-auth-form .text-muted,
	    .expert-auth-form .form-label {
	        color: rgba(226, 232, 240, 0.85) !important;
	    }
	    .expert-auth-form .form-control {
	        background: rgba(2, 6, 23, 0.40);
	        border-color: rgba(148, 163, 184, 0.25);
	        color: #e5e7eb;
	    }
}