/* Tema global morado #4b3c8c */
@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700;800&display=swap');

:root {
    --theme-primary: #4b3c8c;
    --theme-primary-dark: #3a2e6d;
    --theme-primary-light: #5f4da8;
    --theme-primary-soft: #eeeaf8;
    --theme-ink: #1c2430;
    --theme-muted: #5b6777;
    --theme-line: #e3e8ee;
    --theme-font: 'Figtree', system-ui, sans-serif;
}

/* ---------- Topbar ---------- */
#header.header.bg-nav,
.header.navbar-default.bg-nav,
.bg-nav {
    background: linear-gradient(90deg, var(--theme-primary) 0%, var(--theme-primary-dark) 100%) !important;
    border-bottom: 0 !important;
    box-shadow: 0 4px 18px rgba(75, 60, 140, .28);
    font-family: var(--theme-font);
}

#header .navbar-brand,
#header .navbar-nav .text-white,
#header .navbar-toggle,
#header .navbar-toggle.text-white {
    color: #fff !important;
    font-family: var(--theme-font);
    font-weight: 600;
}

#header .dropdown-menu {
    border-radius: 12px;
    border: 1px solid var(--theme-line);
    box-shadow: 0 8px 24px rgba(28, 36, 48, .1);
    font-family: var(--theme-font);
}

#header .dropdown-menu .dropdown-item:hover {
    background: var(--theme-primary-soft);
    color: var(--theme-primary-dark);
}

/* ---------- Sidebar ---------- */
#sidebar.sidebar,
.sidebar-bg {
    background: #f7f5fc !important;
}

#sidebar.sidebar {
    font-family: var(--theme-font);
    border-right: 1px solid #e6e1f2;
}

/* Bloque categoría / módulo (modernizado) */
#sidebar .nav > li.nav-profile.theme-nav-profile {
    padding: 14px 12px 10px !important;
    background: transparent !important;
    height: auto !important;
    margin: 0 !important;
}

#sidebar .nav > li.nav-profile.theme-nav-profile > a {
    display: block !important;
    padding: 0 !important;
    height: auto !important;
    margin: 0 !important;
    background: transparent !important;
    color: inherit !important;
}

#sidebar .nav > li.nav-profile.theme-nav-profile .cover {
    display: none !important;
}

#sidebar .nav > li.nav-profile.theme-nav-profile .theme-nav-profile__card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--theme-primary) 0%, var(--theme-primary-light) 100%);
    box-shadow: 0 10px 22px rgba(75, 60, 140, .22);
    min-height: 72px;
}

#sidebar .nav > li.nav-profile.theme-nav-profile .theme-nav-profile__media {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 12px;
    overflow: hidden;
    background: rgba(255, 255, 255, .18);
    border: 2px solid rgba(255, 255, 255, .35);
    display: flex;
    align-items: center;
    justify-content: center;
}

#sidebar .nav > li.nav-profile.theme-nav-profile .theme-nav-profile__media img,
#sidebar .nav > li.nav-profile.theme-nav-profile .image,
#sidebar .nav > li.nav-profile.theme-nav-profile .image img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: cover;
    border-radius: 10px;
    position: static !important;
    left: auto !important;
    top: auto !important;
}

#sidebar .nav > li.nav-profile.theme-nav-profile .image {
    width: 48px !important;
    height: 48px !important;
    flex: 0 0 48px;
}

#sidebar .nav > li.nav-profile.theme-nav-profile .theme-nav-profile__meta,
#sidebar .nav > li.nav-profile.theme-nav-profile .info {
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    padding: 0 !important;
    color: #fff !important;
    line-height: 1.25;
    min-width: 0;
    flex: 1;
}

#sidebar .nav > li.nav-profile.theme-nav-profile .theme-nav-profile__label {
    display: block;
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    opacity: .8;
    margin-bottom: 2px;
}

#sidebar .nav > li.nav-profile.theme-nav-profile .theme-nav-profile__title,
#sidebar .nav > li.nav-profile.theme-nav-profile .info {
    font-size: .95rem;
    font-weight: 700;
    color: #fff !important;
    word-break: break-word;
}

#sidebar .nav > li.nav-header {
    color: var(--theme-primary) !important;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    font-size: .72rem;
}

#sidebar .nav > li > a {
    color: var(--theme-primary-dark) !important;
    border-radius: 10px;
    margin: 2px 10px;
    font-weight: 600;
}

#sidebar .nav > li > a i {
    color: var(--theme-primary) !important;
}

#sidebar .nav > li.active > a,
#sidebar .nav > li.active > a:hover,
#sidebar .nav > li > a:hover,
#sidebar .nav > li > a:focus {
    background: var(--theme-primary) !important;
    color: #fff !important;
}

#sidebar .nav > li.active > a i,
#sidebar .nav > li > a:hover i,
#sidebar .nav > li > a:focus i {
    color: #fff !important;
}

.page-with-light-sidebar.page-sidebar-minified .sidebar .nav > li.active > a,
.sidebar .nav > li.active > a {
    background: var(--theme-primary) !important;
    color: #fff !important;
}

/* ---------- Botones / acentos globales ---------- */
.btn-primary,
.btn.btn-primary,
a.btn-primary {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
    color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active {
    background-color: var(--theme-primary-dark) !important;
    border-color: var(--theme-primary-dark) !important;
}

.bg-blue,
.modal-header.bg-blue,
.panel-heading.bg-blue {
    background: linear-gradient(120deg, var(--theme-primary), var(--theme-primary-light)) !important;
}

a,
a:hover {
    color: var(--theme-primary);
}

.page-link:hover {
    color: var(--theme-primary);
}

.pagination .page-item.active .page-link {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
    color: #fff !important;
}

.badge-primary,
.label-primary {
    background-color: var(--theme-primary) !important;
}

/* ---------- Login / registro ---------- */
.login .brand b,
.login-header .brand b {
    color: var(--theme-primary);
    font-family: var(--theme-font);
}

.login .brand small,
.login-header .brand small {
    color: var(--theme-muted);
    font-family: var(--theme-font);
}

.login .login-content,
.login .right-content {
    font-family: var(--theme-font);
}

.login .btn-primary {
    background-color: var(--theme-primary) !important;
    border-color: var(--theme-primary) !important;
    box-shadow: 0 8px 18px rgba(75, 60, 140, .22);
}

.login .btn-primary:hover {
    background-color: var(--theme-primary-dark) !important;
    border-color: var(--theme-primary-dark) !important;
}

.login .btn-default {
    border-color: var(--theme-line);
    color: var(--theme-primary-dark);
}

.login .btn-default:hover {
    background: var(--theme-primary-soft);
    border-color: var(--theme-primary);
    color: var(--theme-primary-dark);
}

.login a {
    color: var(--theme-primary);
    font-weight: 600;
}

.login .form-control:focus {
    border-color: var(--theme-primary);
    box-shadow: 0 0 0 .2rem rgba(75, 60, 140, .15);
}

.login .checkbox.checkbox-css input:checked + label:before,
.login .checkbox-css input[type=checkbox]:checked + label:before {
    background: var(--theme-primary);
    border-color: var(--theme-primary);
}

.login .news-caption {
    background: linear-gradient(to top, rgba(75, 60, 140, .85), transparent);
}

#page-loader .spinner {
    border-top-color: var(--theme-primary);
}