body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Default background for all non-login pages */
body:not(.login-page) {
    background-color: #f8f9fa;
}

/* Login page background */
body.login-page {
    min-height: 100vh;
    margin: 0;
    background: #000 url('../img/stellenk9_login_bg.jpg') center center no-repeat;
    background-size: cover;
}

/* Center the login content vertically and horizontally on login page */
body.login-page main.container {
    min-height: 100vh;
    margin-top: 0;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Hide navbar entirely on login page (prevents floating brand button) */
body.login-page nav.navbar {
    display: none;
}

/* Make the login column wider on desktop */
@media (min-width: 992px) {
    body.login-page .row.justify-content-center {
        justify-content: center !important;
    }
    body.login-page .col-md-5 {
        flex: 0 0 640px;
        max-width: 640px;
    }
}

/* Login card styling */
.login-card {
    background: rgba(0, 0, 0, 0.78);
    color: #ffffff;
    border-radius: 0.75rem;
    width: 100%;
}

/* Logo above login form */
.login-logo {
    max-width: 260px;
    height: auto;
}

/* Labels and text on login card */
body.login-page .login-card .form-label,
body.login-page .login-card label,
body.login-page .login-card h1,
body.login-page .login-card p {
    color: #ffffff;
}

/* Inputs stay readable on dark card */
body.login-page .login-card .form-control {
    background-color: rgba(255, 255, 255, 0.94);
    color: #000000;
}

/* General card rounding across site */
.card {
    border-radius: 0.75rem;
}

.btn {
    border-radius: 0.5rem;
}

table.table-sm td,
table.table-sm th {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

/* Medium screens / tablets */
@media (max-width: 991.98px) {
    body.login-page main.container {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .login-logo {
        max-width: 220px;
    }
}

/* Phones */
@media (max-width: 768px) {
    body.login-page main.container {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
    }

    .login-logo {
        max-width: 190px;
    }

    .login-card .card-body {
        padding: 1.5rem !important;
    }
}

/* Very small phones */
@media (max-width: 480px) {
    .login-card .card-body {
        padding: 1.25rem !important;
    }
}


/* --- Added padding/centering for login page --- */
body.login-page .container-fluid {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 3rem;
    padding-bottom: 3rem;
}

body.login-page .login-card {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}