/* Full-bleed hero background */
.auth-page-wrapper {
    /* CHANGED: fix to viewport and remove any theme spacing */
    position: fixed;
    top: 0; right: 0; bottom: 0; left: 0;
    min-height: 100vh;
    margin: 0 !important;
    padding: 0 !important;
    background: #0b1220;
    z-index: 0; /* background layer */
}

/* Fixed background that always fills the viewport, sits behind content */
.auth-bg-fixed{
    position: fixed;
    inset: 0;
    background-size: cover;
    background-position: center;
    z-index: 0;
}

/* Only the glass bits need to sit above bg */
.auth-glass-wrap,
.auth-glass{
    position: relative;
    z-index: 1;
}

/* Dark gradient wash on image for contrast (kept for optional .auth-hero use) */
.auth-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events:none;
    z-index:1;
    background: rgba(0,0,0,.20);
}
.auth-hero{
    z-index:0;
    position: absolute;
    inset: 0;
    background-image: var(--auth-hero-url) !important;
    background-size: cover !important;
    background-position: center !important;
}

/* LEFT COLUMN = full-height panel */
.auth-glass-wrap{
    position: absolute;           /* stick it to the left of the viewport */
    top: 0; left: 0; bottom: 0;
    width: clamp(320px, 34vw, 720px);
    display: flex; align-items: center;
    padding: 48px 48px 88px;

    /* make the LEFT panel solid white (top->bottom) instead of glass */
    background: #fff;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-right: 1px solid rgba(0,0,0,.06);
    box-shadow: none;
    min-height: 100vh;
}

/* Inner container */
.auth-glass {
    width: 100%;
    border: none;
    padding: 0;
    background: transparent;
    box-shadow: none;
    color: #1f2937 !important; /* dark text on white */
}

/* Inputs/buttons */
.auth-glass h5,
.auth-glass p,
.auth-glass label { color:#1f2937 !important; }

.auth-glass .form-control,
.auth-glass .form-select {
    background:#fff !important;
    border:1px solid #ced4da !important;
    color:#212529 !important;
}
.auth-glass .form-control::placeholder { color:#6c757d !important; }

.auth-glass .form-control:focus,
.auth-glass .form-select:focus {
    border-color: rgba(33,37,41,.6);
    box-shadow: none;
}
.auth-glass .invalid-feedback { display:block; }

.auth-glass .btn-success { font-weight: 600; }
.auth-glass a.text-muted:hover { color: #000 !important; }
.auth-glass .password-addon { color: #6c757d !important; }
.auth-glass .password-addon:hover { color: #000 !important; }
.auth-glass .form-select option { color: #000; }

/* Hide legacy wave BG/shape if present */
.auth-one-bg-position, .auth-one-bg, .shape { display: none !important; }

/* Footer small + centered */
.auth-footer {
    position: absolute;
    left: 48px; right: 48px; bottom: -29rem;
    z-index: 2;
    text-align: center;
}
.auth-footer a { color: #878a99; text-decoration: none; opacity: .85; }
.auth-footer a:hover { opacity: 1; text-decoration: underline; }

/* Franchise select validation colors */
#select_id.is-invalid { border-color: #dc3545 !important; }
#select_id.is-valid   { border-color: #198754 !important; }

/* Franchise dropdown: visible arrow + pointer cursor */
#select_id {
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #fff;
}

i.ri-arrow-down-s-line { cursor: pointer;}

#franchise-wrapper i.ri-arrow-down-s-line {
    color: #6c757d;
}

#select_id:hover {
    border-color: #adb5bd;
}
#select_id:focus {
    outline: 0;
    border-color: #86b7fe;
    box-shadow: 0 0 0 .2rem rgba(13,110,253,.15);
}

#login-submit[disabled] { opacity: .85; cursor: not-allowed; }
#login-submit {
    height: 46px; /* same as your input height for balance */
}
#login-submit .spinner-border {
    width: 1.3rem;
    height: 1.3rem;
}
#login-submit .spinner-border {
    color: #fff; /* matches text color */
}
span.btn-label { padding-left: 0 !important; }



/* Desktop spacing – keep reasonable padding, no huge push-in */
@media (min-width: 992px) {
    .auth-glass-wrap { padding: 64px 64px 96px; }
}

/* Mobile: panel becomes centered card */
@media (max-width: 991.98px){
    .auth-glass-wrap{
        position: relative; width: 100%; min-height: 100vh;
        border-right: none; box-shadow: none; padding: 32px 20px 56px;
        background: #fff;
        color: #1f2937;
    }
    .auth-glass,
    .auth-glass h5,
    .auth-glass p,
    .auth-glass label { color:#1f2937 !important; }
    .auth-glass .form-control,
    .auth-glass .form-select {
        background: #fff !important;;
        border: 1px solid #ced4da !important;
        color: #212529 !important;
    }
    .auth-glass .form-control::placeholder { color: #6c757d !important; }
}

/* Safety: avoid horizontal peeking */
html, body { overflow-x: hidden; }