/* ===== Global ===== */
body {
/*    font-family: 'Inter', sans-serif;
    background: url('/images/SMB-Product-Log-In-edit.jpg') no-repeat fixed;
    background-size: contain;*/
}
/* ===== Left Panel ===== */
.left-panel {
    background: url('/images/SMB-Product-Log-In-edit.jpg') no-repeat;
    background-size: contain;
    position: relative;
}

    .left-panel::before {
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(255, 255, 255, 0); /* optional white overlay */
    }

    .left-panel > * {
        position: relative;
        z-index: 1;
    }

/* ===== Right Panel Card ===== */

.right-panel {
    background: #ffffff; /* solid white background */
    min-height: 100vh;
}

    .right-panel .card {
        max-width: 420px;
    }

    .right-panel .card,
    .right-panel {
        background: #ffffff !important; /* solid white */
        border: none !important;
        box-shadow: none !important;
    }

#imgSMCLogo {
    max-width: 180px;
}

input::-ms-reveal,
input::-ms-clear {
    display: none;
}


/* ===== Inputs ===== */
.form-control {
    border-radius: 0.5rem;
    font-size: 0.95rem;
    padding: 0.75rem 1rem;
}

    .form-control:focus {
        border-color: #E74C3C;
        box-shadow: 0 0 0 0.25rem rgba(231, 76, 60, 0.25);
    }

/* Floating labels */
.form-floating label {
    font-size: 0.9rem;
    color: #666;
}

/* ===== Forgot password link ===== */
a.small {
    color: #E74C3C;
    transition: color 0.2s;
}

    a.small:hover {
        color: #c0392b;
    }

/* ===== Login Button ===== */
.btn-primary {
    border-radius: 0.5rem;
    font-weight: 600;
    background: #E74C3C;
    border: none;
    transition: background 0.3s;
}

    .btn-primary:hover {
        background: #c0392b;
    }

/* ===== Responsive ===== */
@media (max-width: 768px) {
    .left-panel {
        display: none !important; /* hide left panel on mobile */
    }

    .right-panel {
        min-height: 100vh; /* take full height when left panel is hidden */
    }

    body {
        font-family: 'Inter', sans-serif;
        background: url('/images/SMB-Product-Log-In-edit.jpg') no-repeat fixed;
        background-size: contain;
    }

    .card {
        border-radius: 0.75rem;
        box-shadow: none; /* simpler look on mobile */
    }

        .card h2 {
            font-size: 1.5rem;
        }

    .form-control {
        font-size: 0.9rem;
    }

    .btn-primary {
        font-size: 1rem;
        padding: 0.6rem;
    }
}

/*totp image sizing*/
.img-totp {
    width: 25%;
    height: 25%;
}