/*
 * NEW STYLES FOR THE TWO-COLUMN BOOTSTRAP 5 LOGIN PAGE
 */

/* 1. Set a clean, light background for the entire page. */
body {
    background-color: #f8f9fa; /* A light grey, matching Bootstrap's bg-light */
    height: 100vh;
    overflow: hidden; /* Prevents unwanted scrollbars on the body */
}


/* 2. Styles for the right-hand image column. */
.login-image-shape {
    height: 100vh; /* Make it take the full screen height */
    position: relative;
    overflow: hidden; /* Hide any part of the image that spills out */

    /* This creates the large rounded corner effect on the left side */
    border-top-left-radius: 8rem;    /* 128px */
    border-bottom-left-radius: 8rem; /* 128px */
}

/* 3. Utility to make the image fill its container perfectly. */
.login-image-shape .object-cover {
    object-fit: cover;
}

/* 4. Media query to hide the image on screens smaller than large (992px) */
@media (max-width: 991.98px) {
    .login-image-shape {
        display: none;
    }
}