:root {
    --sidebar-bg: #111827;
    --sidebar-text: #cbd5e1;
    --sidebar-text-active: #ffffff;
    --sidebar-active-bg: #1d4ed8;
    --topbar-bg: #ffffff;
    --topbar-border: #e5e7eb;
    --content-bg: #f8fafc;
    --card-bg: #ffffff;
    --text-primary: #0f172a;
    --text-secondary: #64748b;
}

body.dark-mode {
    --sidebar-bg: #111827;
    --sidebar-text: #b8c4d6;
    --sidebar-text-active: #ffffff;
    --sidebar-active-bg: #1d4ed8;
    --topbar-bg: #111827;
    --topbar-border: #2a3444;
    --content-bg: #111827;
    --card-bg: #1f2937;
    --text-primary: #e5e7eb;
    --text-secondary: #9aa8bd;
}

.main-sidebar,
.main-sidebar::before {
    background-color: var(--sidebar-bg);
}

.sidebar-dark-primary .brand-link {
    border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}

.sidebar-dark-primary .brand-link,
.sidebar-dark-primary .brand-link .brand-text,
.sidebar-dark-primary .nav-link,
.sidebar-dark-primary .nav-icon,
.sidebar-dark-primary .user-panel .info,
.sidebar-dark-primary .user-panel .info a {
    color: var(--sidebar-text);
}

.sidebar .nav-header,
.sidebar-dark-primary .nav-header {
    color: #94a3b8 !important;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:hover,
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:focus {
    background-color: rgba(37, 99, 235, 0.14);
    color: var(--sidebar-text-active);
}

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active {
    background-color: var(--sidebar-active-bg);
    color: var(--sidebar-text-active);
    box-shadow: 0 6px 16px rgba(29, 78, 216, 0.24);
}

.main-header.navbar {
    background-color: var(--topbar-bg) !important;
    border-bottom: 1px solid var(--topbar-border) !important;
    box-shadow: none !important;
}

.main-header .nav-link,
.main-header .navbar-nav .nav-link,
.main-header .navbar-nav .nav-link .far,
.main-header .navbar-nav .nav-link .fas,
.main-header .navbar-nav .nav-link .fa,
.main-header .navbar-nav .nav-link p,
.main-header .navbar-nav .nav-item > .nav-link {
    color: var(--text-secondary) !important;
}

body,
.content-wrapper,
.dark-mode .content-wrapper,
.dark-mode .main-footer {
    background-color: var(--content-bg) !important;
    color: var(--text-primary);
}

.card,
.small-box,
.info-box,
.dark-mode .card,
.dark-mode .small-box,
.dark-mode .info-box {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--topbar-border) !important;
    box-shadow: 0 4px 14px rgba(2, 6, 23, 0.18);
}

.dark-mode .card-header,
.dark-mode .card-footer {
    border-color: #2a3444 !important;
}

.card-title,
.content-header h1,
.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6,
.dark-mode .card-title,
.dark-mode .card-body,
.dark-mode .card-header,
.dark-mode .card-footer,
.dark-mode .content-header h1,
.dark-mode .content,
.dark-mode .main-footer {
    color: var(--text-primary) !important;
}

.text-muted,
.small,
.form-text,
.breadcrumb-item,
.breadcrumb-item a,
.dark-mode .text-muted,
.dark-mode .small,
.dark-mode .form-text,
.dark-mode .breadcrumb-item,
.dark-mode .breadcrumb-item a {
    color: var(--text-secondary) !important;
}

.login-page,
.register-page {
    background: linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
}

.dark-mode.login-page,
.dark-mode.register-page {
    background: linear-gradient(180deg, #111827 0%, #0b1220 100%);
}

.login-card-body,
.register-card-body {
    color: var(--text-primary);
}

.login-box,
.register-box {
    width: 430px;
    max-width: calc(100vw - 28px);
}

.login-box .card,
.register-box .card {
    border-radius: 18px;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.1);
    overflow: hidden;
}

.login-box-msg,
.register-box-msg {
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0;
}

.dark-mode .login-box-msg,
.dark-mode .register-box-msg {
    color: var(--text-primary);
}

.login-subtitle {
    color: #64748b;
    font-size: 0.9rem;
    text-align: center;
    margin-bottom: 22px;
}

.dark-mode .login-subtitle {
    color: var(--text-secondary);
}

.login-card-body .input-group,
.register-card-body .input-group {
    margin-bottom: 14px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    overflow: hidden;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.login-card-body .form-control,
.register-card-body .form-control {
    height: 46px;
    border: 0;
    box-shadow: none;
}

.login-card-body .input-group > .form-control:not(:last-child),
.register-card-body .input-group > .form-control:not(:last-child) {
    border-radius: 0;
}

.login-card-body .input-group-text,
.register-card-body .input-group-text {
    border-radius: 0;
    background-color: #f8fafc;
    border: 0;
    color: #64748b;
}

.login-card-body .input-group:focus-within,
.register-card-body .input-group:focus-within {
    border-color: #93c5fd;
    box-shadow: 0 0 0 0.2rem rgba(37, 99, 235, 0.15);
}

.login-card-body .form-control:focus,
.register-card-body .form-control:focus {
    box-shadow: none;
}

.dark-mode .login-card-body .input-group-text,
.dark-mode .register-card-body .input-group-text {
    background-color: #0f172a;
    color: var(--text-secondary);
}

.dark-mode .login-card-body .form-control,
.dark-mode .register-card-body .form-control {
    border: 0;
}

.dark-mode .login-card-body .input-group,
.dark-mode .register-card-body .input-group {
    border-color: #2a3444;
}

.dark-mode .login-card-body .input-group:focus-within,
.dark-mode .register-card-body .input-group:focus-within {
    border-color: #3b82f6;
    box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.2);
}

.forgot-link {
    color: #2563eb;
    font-weight: 500;
    text-decoration: none;
}

.forgot-link:hover,
.forgot-link:focus {
    color: #1d4ed8;
    text-decoration: underline;
}

.login-card-body .btn,
.register-card-body .btn {
    height: 46px;
    border-radius: 10px;
    font-weight: 600;
}

.login-card-body .btn-block,
.register-card-body .btn-block {
    width: 100%;
}

.login-card-body .icheck-primary label,
.register-card-body .icheck-primary label {
    font-weight: 500;
    color: #334155;
}

.dark-mode .login-card-body .icheck-primary label,
.dark-mode .register-card-body .icheck-primary label {
    color: var(--text-primary);
}

.auth-sesc80-badge {
    position: fixed;
    top: 16px;
    right: 20px;
    z-index: 1060;
    pointer-events: none;
}

.auth-sesc80-badge img {
    width: min(300px, 32vw);
    max-height: 78px;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 3px 10px rgba(15, 23, 42, 0.16));
}

@media (max-width: 768px) {
    .auth-sesc80-badge {
        top: 10px;
        right: 12px;
    }

    .auth-sesc80-badge img {
        width: min(180px, 44vw);
        max-height: 52px;
    }

    .login-box,
    .register-box {
        margin-top: 42px;
    }
}

.btn-primary {
    background-color: var(--sidebar-active-bg);
    border-color: var(--sidebar-active-bg);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #1d4ed8;
    border-color: #1d4ed8;
}
