/* Custom styling for Jazzmin login page */

/* Apply background image ONLY to login page */
body.login,
.login-page {
    background: url('/static/img/login_bg.jpg') no-repeat center center fixed !important;
    background-size: cover !important;
}

/* Make login box semi-transparent - 30% */
body.login .card,
.login .card,
.login-box,
body.login .card.card-outline,
.login-card-body,
.card-body.login-card-body {
    background-color: rgba(255, 255, 255, 0.3) !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Dark mode support - 30% transparent */
@media (prefers-color-scheme: dark) {
    body.login .card,
    .login .card,
    .login-box,
    body.login .card.card-outline,
    .card-body.login-card-body {
        background-color: rgba(52, 58, 64, 0.1) !important;
    }
}

/* Ensure the wrapper doesn't block the background on login page */
.login-page .wrapper,
.login-page .content-wrapper,
body.login .wrapper,
body.login .content-wrapper {
    background: transparent !important;
}

/* Hide login logo section - ONLY on login/logout pages */
body.login .login-logo,
body.login .brand-link,
body.login h1.brand-link,
body.login .card-header,
body.logout .login-logo,
body.logout .brand-link,
body.logout h1.brand-link,
body.logout .card-header,
.login-page .login-logo,
.login-page .brand-link,
.login-page h1.brand-link,
.login-page .card-header {
    display: none !important;
}

/* Style login message - white and bold */
.login-box-msg {
    color: white !important;
    font-weight: bold !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
}

/* Logout page styling - same as login (only for logout pages) */
body.logout {
    background: url('/static/img/login_bg.jpg') no-repeat center center fixed !important;
    background-size: cover !important;
}

/* Logout page card - 30% transparent like login - more specific selectors */
body.logout .card,
body.logout .card-body,
.logout-page .card,
.logout-page .card-body,
body[class*="logout"] .card,
body[class*="logout"] .card-body,
body.logout .card.card-outline.card-primary,
.logout-page .card.card-outline.card-primary {
    background-color: rgba(255, 255, 255, 0.3) !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

/* Logout page text-center - white text */
.card-body.text-center,
.logout .card-body.text-center,
.text-center,
body.logout .card-body,
body[class*="logout"] .card-body {
    color: white !important;
    font-weight: bold !important;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7) !important;
}

/* Dark mode support for logout */
@media (prefers-color-scheme: dark) {
    body.logout .card,
    body.logout .card-body,
    .logout-page .card,
    .logout-page .card-body,
    body[class*="logout"] .card,
    body[class*="logout"] .card-body {
        background-color: rgba(52, 58, 64, 0.1) !important;
    }
}

/* Fix navbar user menu alignment - ensure it stays on the right */
.navbar-nav.ml-auto {
    margin-left: auto !important;
}

/* Additional navbar alignment fix */
.main-header .navbar-nav.ml-auto {
    margin-left: auto !important;
}

/* Ensure user dropdown button is clickable */
.navbar-nav .nav-item.dropdown .nav-link,
.navbar-nav .nav-item .nav-link[data-toggle="dropdown"] {
    cursor: pointer !important;
    pointer-events: auto !important;
    position: relative !important;
    z-index: 1000 !important;
}

/* Ensure dropdown menus are visible when shown */
.dropdown-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Ensure dropdown has proper z-index and positioning */
.navbar .dropdown-menu,
#jazzy-usermenu {
    z-index: 1050 !important;
    position: absolute !important;
}
