body {
    font-family: -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Fira Sans, Ubuntu, Oxygen, Oxygen Sans, Cantarell, Droid Sans, Apple Color Emoji, Segoe UI Emoji, Segoe UI Emoji, Segoe UI Symbol, Lucida Grande, Helvetica, Arial, sans-serif;
    color: #28292b;
    -webkit-font-smoothing: antialiased;
    margin: 0;
    padding: 0;
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}

.login-container {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    padding: 30px;
    text-align: center;
    margin-top: 6%;
}

.login-option {
    margin-bottom: 20px;
}

.login-option img {
    object-fit: cover;
}

.login-button {
    display: inline-flex;
    width: 300px;
    align-items: center;
    justify-content: center;
    background-color: #3d3d3d;
    color: #fff;
    padding: 10px 20px 10px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 16px;
}

.login-button-sso {
    background-color: white;
    color: #3d3d3d;
    border: 1px solid #dcdcdc;
}

.login-icon {
    width: 100px;
}

.login-value {
    display: inline-flex;
    justify-content: flex-start;
    width: 200px;
}

.login-page-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    align-items: center;
}

.logo-image-hero-light {
    padding: 10px;
    filter: none;
}

.hidden {
    display: none;
}

.email-input {
    width: -webkit-fill-available;
    padding: 10px 0 10px 12px;
    background-clip: padding-box;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    background-color: transparent;
    color: #3d3d3d;
    height: auto;
}

.email-input:focus {
    background-color: transparent;
}

.email-submit {
    border: 1px solid #3d3d3d;
    background-color: #3d3d3d;
    border-radius: 5px;
    padding: 12px 45px;
    cursor: grab;
    width: fit-content;
    font-weight: 600;
    margin-top: 25px;
    color: white;
}

.notification-banner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #0078d4;
    /* Blue background */
    color: white;
    padding: 10px 20px;
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.notification-banner p {
    margin: 0 auto;
    font-size: 16px;
}

.banner-link {
    color: #ffe600;
    /* Bright yellow link */
    text-decoration: underline;
    font-weight: bold;
    margin-left: 10px;
}

.banner-link:hover {
    text-decoration: none;
}

.close-banner {
    background: none;
    border: none;
    color: white;
    font-size: 20px;
    cursor: pointer;
}

.close-banner:hover {
    color: #ffe600;
}