











@font-face {
    font-family: 'wfr-icons';
    src: url('./fonts/wfr-icons.ttf?2vjr7h') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'kronos-ready-icons';
    src: url('./fonts/kronos-ready-icons.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('./fonts/DMSans-VariableFont_opsz,wght.woff2') format('woff2');
}

@font-face {
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('./fonts/DMSans-Italic-VariableFont_opsz,wght.woff2') format('woff2');
}

:root {
    --color_theme_300: #D7EAF5;
    --color_theme_400: #C2DEF0;
    --color_theme_500: #99C8E5;
    --color_theme_800: #3576B0;
    --color_theme_900: #2B6AA1;
    --color_theme_1000: #1F4F7A;
    --color_theme_login_bg: #F9FAFB;
    --color_theme_text_OnDark: #FFFFFF;
    --color_theme_text_OnLight: #153551;

    --rdy_sys_color_important: #DC0C22;
    --rdy_sys_color_success: #008060;
    --rdy_sys_color_warning: #cc7300;

    --rdy_sys_color_surface_light: #ffffff;
    --rdy_sys_color_surface_lightDarkest: #eeeeee;
    --rdy_sys_color_surface_lightDarker: #f5f5f5;
    --rdy_sys_color_surface_lightDark: #FBFBFB;
    --rdy_sys_color_surface_success: #EDF6F4;
    --rdy_sys_color_surface_disabled_onLight: #0000000a;
    --rdy_sys_color_text_highEmphasis_onDark: #ffffff;
    --rdy_sys_color_text_highEmphasis_onLight: #000000de;
    --rdy_sys_color_text_lowEmphasis_onLight: #00000099;
    --rdy_sys_color_text_disabled_onLight: #0000004d;
    --rdy_sys_color_action_enabled: #0176b2;
    --rdy_sys_color_action_monochrome_disabled_onLight: #00000033;
    --rdy_sys_color_action_hover: #005c89;
    --rdy_sys_color_action_monochrome_enabled_onLight: rgba(0, 0, 0, 0.65);
    --rdy_sys_color_hover_onLight: #0000000d;
    --rdy_sys_color_active_onLight: #00000017;
    --rdy_sys_color_border_midEmphasis_onLight: #00000026;
    --rdy_sys_color_border_lowEmphasis_onLight: #0000001a;
    --rdy_sys_color_border_highEmphasis_onLight: rgba(0,0,0,0.47);
    --rdy_sys_color_surfaceBorder_success: #C5E2DB;
    --rdy_sys_color_focusBorder_onLight: #016ca2;
    --rdy_sys_color_text_action_enabled: #016ca2;
    --rdy_sys_color_info: #617BFF;
    --rdy_sys_color_hoverHighlight: #f2f8fb;
    --rdy_sys_color_scrim: #00000052;

    --clickable-item-compact-width: 28px;
    --clickable-item-compact-height: 28px;
}

/* ===== START: Reset styles ===== */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, dl, dt, dd, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1;
}

ol, ul {
    margin: 0;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* ===== END: Reset styles ===== */

/* ===== START: Global styles ===== */
html, body {
    min-height: 100%;
}

html {
    overflow-x: hidden;
}

body {
    background: var(--color_theme_login_bg);
    font-family: 'DM Sans';
    font-optical-sizing: none;
    font-synthesis: none;
}

body > form {
    display: block;
    min-height: 90vh;
}

input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

a {
    position: relative;
    padding: 6px 8px;
    outline: none;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: normal;
    color: var(--rdy_sys_color_focusBorder_onLight);
}

a:hover {
    text-decoration: underline;
}

a:focus::before {
    position: absolute;
    top: 50%;
    right: -8px;
    left: -8px;
    height: 100%;
    min-height: 28px;
    padding: 2px 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    border-radius: 1000px;
    border: 1px solid #fff;
    -webkit-box-shadow: inset 0 0 0 2px var(--rdy_sys_color_focusBorder_onLight);
    box-shadow: inset 0 0 0 2px var(--rdy_sys_color_focusBorder_onLight);
    outline: 3px solid transparent;
    content: "";
}

button, select, input, textarea {
    font-family: 'DM Sans';
}

.default-list {
    display: block;
    list-style-type: disc;
    padding-left: 24px;
}

.default-list > .list-item {
    display: list-item;
}

blockquote {
    margin: 16px 40px 16px 24px;
    padding: 0 0 0 16px;
    border-left: 2px solid #d3d3d3;
}

footer {
    padding: 40px 32px 20px;

    @media screen and (min-width: 1018px) {
        padding-right: 80px;
        padding-left: 80px;
    }
}

/* ===== END: Global styles ===== */

/* ===== START: Popup styles ===== */
#PAGE_POPUP_MAXIMIZE_MINIMIZE {
    display: none;
    position: fixed;
    z-index: 2150;
    cursor: pointer;
}

#PAGE_POPUP_MINIMIZE {
    position: fixed;
    z-index: 2150;
}

#PAGE_POPUP_MAXIMIZE {
    position: fixed;
    z-index: 2150;
}

#PAGE_POPUP {
    display: none;
    position: fixed;
    z-index: 2100;
}

#PAGE_POPUP #PAGE_POPUP_TITLE {
    cursor: move;
    min-height: 20px;
    text-align: center;
}

#PAGE_POPUP_TITLE_BODY {
    font-size: 12px;
    color: #333;
    font-weight: bold;
    width: 100%;
    margin-top: 5px;
    margin-left: 20px;
}

#PAGE_POPUP_TITLE_BODY {
    font-size: 12px;
    padding: 14px 40px 14px 20px;
    width: auto;
    margin: 0;
    -webkit-box-shadow: 0 0 8px #d2d2d2;
    box-shadow: 0 0 8px #d2d2d2;
    font-weight: 700;
}

#PAGE_POPUP_BODY {
    padding: 6px 0 0;
}

#PAGE_GRAY, .pageGrayTOP {
    display:none;
    position: fixed;
    left: 0;
    top: 0;
    bottom:0;
    right:0;
    z-index: 2000;
}

.popUp {
    padding: 0;
    overflow: hidden;
    background: var(--rdy_sys_color_surface_light);
    border-radius: 3px;
    -webkit-box-shadow: 0px 0px 5px 1px rgba(84, 84, 84, 0.35);
    box-shadow: 0px 0px 5px 1px rgba(84, 84, 84, 0.35);
}

.popupClose {
    position: absolute;
    top: 12px;
    right: 15px;
    cursor: pointer;
}

.toolTip {
    padding: 3px;
    vertical-align: middle;
    display: none;
    position: absolute;
    text-align: left;
    background-color: var(--rdy_sys_color_surface_light);
    -webkit-box-shadow: 0px 0px 5px 1px rgba(84, 84, 84, 0.35);
    box-shadow: 0px 0px 5px 1px rgba(84, 84, 84, 0.35);
}

/* ===== END: Popup styles ===== */

/* ===== START: Custom Dropdown styles ===== */
.dropdown_element {
    display: block;
    position: relative;
    height: 40px;
}

.dropdown {
    position: relative;
    width: inherit;
    height: inherit;
    border-radius: 8px;
}

.dropdown:focus-visible {
    outline-color: var(--rdy_sys_color_focusBorder_onLight);
}

.dropdown:focus-visible .dropdown_toggle,
#FldLanguageOverride .dropdown:focus-visible .dropdown_toggle {
    border-color: var(--rdy_sys_color_focusBorder_onLight);
}

.dropdown .dropdown_toggle {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    position: relative;
    overflow: hidden;
    height: inherit;
    text-align: center;
    box-sizing: border-box;
    border: 1px solid rgba(0, 0, 0, 0.47);
    justify-content: space-between;
    background-color: var(--rdy_sys_color_surface_light);
    padding: 8px 16px;
    border-radius: 8px;
    cursor: pointer;
}

.dropdown .dropdown_toggle.open {
    border-bottom: none;
    box-shadow: 0 1px 3px rgba(51, 51, 51, 0.35);
}

.dropdown .dropdown_toggle .dropdown_toggle_text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    letter-spacing: -0.3px;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
    font-size: 16px;
    font-weight: 500;
    line-height: 18px;
}
.dropdown .dropdown_toggle:hover {
    text-decoration: none;
}

.dropdown .dropdown_arrow {
    font-size: 10px;
    margin: 0;
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
    font-family: "kronos-ready-icons";
}
.dropdown .dropdown_arrow::before {
    content: "\e90f";
}

.dropdown_menu {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1600;
    min-width: 82px;
    border: 1px solid #d6d6d6;
    box-sizing: border-box;
    display: none;
    overflow-y: auto;
    box-shadow: 0 1px 3px rgba(51, 51, 51, 0.35);
    background: var(--rdy_sys_color_surface_light);
}
.dropdown_menu.open {
    display: block;
}

.dropdown_menu .dropdown_menu_list {
    display: block;
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
}

.dropdown_menu_elem {
    display: block;
    position: relative;
    min-height: 35px;
    margin: 0;
    padding: 0;
}

.dropdown_menu_elem.selected {
    background-color: var(--rdy_sys_color_surface_lightDarkest);
}

.dropdown_menu_elem.selected .dropdown_menu_link::before {
    content: '\e925';
    position: absolute;
    top: 7px;
    left: 14px;
    display: inline-block;
    text-align: center;
    font-size: 12px;
    font-family: 'kronos-ready-icons';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.dropdown_menu_elem:hover {
    font-weight: 400;
}
.dropdown_menu .dropdown_menu_link {
    display: block;
    position: relative;
    padding: 9px 40px 8px;
    cursor: pointer;
    text-align: left;
    white-space: nowrap;
    letter-spacing: 0;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
}
.dropdown_menu a.dropdown_menu_link:hover {
    text-decoration: none;
}
.dropdown_menu a.dropdown_menu_link:focus::before {
    right: 0;
    left: 0;
    border-radius: 4px;
}

.dropdown_element .select,
.dropdown_element select {
    position: absolute;
    max-width: 0;
    height: 0;
    opacity: 0;
    pointer-events: none;
    -webkit-appearance: none;
    appearance: none;
}

/* ===== END: Custom Dropdown styles ===== */

/* ===== START: Field styles ===== */
.loginPageInput {
    position: relative;
}

.loginPageInput + .question,
.loginPageInput + .question-title,
.loginPageInput + .loginPageInput,
.loginPageInput + input + .loginPageInput,
.loginPageInput + script + .loginPageInput,
.loginPageInput + script + input[type=hidden] + .loginPageInput,
.loginPageInput + script + .loginPageInput,
#parentdiv:has(> #newPasswordValidation:empty) + .loginPageInput,
#newPasswordValidation:empty + .loginPageInput,
#FldIdentityQuestion ~ span,
#FldIdentityQuestion + .loginPageInput,
#newPasswordValidation:empty + .loginPageInput,
.loginPageInput + #FldSelectYesNo,
#FldSelectYesNo + #FldIdentityQuestion,
.inputFormWr .identityValidation  {
    margin-top: 24px;
}

#FldNationalIdNoView .label,
#FldFullNationalIdNoView .label,
#ZipCode_label {
    text-transform: none;
}

.loginPageInput + script + .loginButtonsPane,
.loginPageInput + script + input[type=hidden] + .loginButtonsPane,
.loginPageInput + .loginButtonsPane,
.login-fieldset + .loginButtonsPane,
.login-fieldset + .loginPageButton,
.login-fieldset > .loginPageButton + .loginPageButton,
.loginPageInput ~ .loginPageButton,
.loginPageButton + .form-text,
.loginPageButton + script + .loginPageButton,
.loginPageButton > .primaryButton + .primaryButton,
.loginPageButton + .forget-field-wrapper,
.clockButton + .clockButton {
    margin-top: 20px;
}

.loginPageInput + .invalidbox:not(:empty),
.loginPageInput + #parentdiv,
.loginPageInput + script + #parentdiv {
    margin-top: 8px;
}

.loginPageInput .label,
.countryPane .label,
#companyCheck .label,
#FldIdentityQuestion .label,
#FldSelectYesNo .label,
.todoButtons > .section .txtLabel,
.inputFormWr .identityValidation {
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
}

.loginPageInput .label {
    font-weight: 400;
    letter-spacing: normal;
    font-size: 14px;
    line-height: 16px;
}

.loginPageInput .label + .fld,
#FldIdentityQuestion .label + select,
#FldSelectYesNo .label + select,
.txtLabel + #FldReasonCodeList,
#FldWFNewNote   {
    margin-top: 4px;
}

.loginPageInput .editFormText,
.loginPageInput .editFormText_disabled,
#FldIdentityQuestion #question,
#FldSelectYesNo select  {
    height: 40px;
    width: 100%;
    padding: 0 16px !important;
    background: var(--rdy_sys_color_surface_light);
    border: 1px solid rgba(0, 0, 0, 0.47);
    border-radius: 8px;
    font-weight: 400;
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
    font-size: 16px;
    line-height: 24px;
}

.loginPageInput .editFormText,
.loginPageInput .editFormText_disabled {
    color: rgba(0, 0, 0, 0.95) !important;

}

.loginPageInput .editFormText:focus,
.loginPageInput .editFormText_disabled:focus,
#FldWFNewNote textarea:focus {
    outline: none;
    border-color: var(--rdy_sys_color_focusBorder_onLight);
    -webkit-box-shadow: inset 0 0 0 1px var(--rdy_sys_color_focusBorder_onLight);
    box-shadow: inset 0 0 0 1px var(--rdy_sys_color_focusBorder_onLight);
}

.loginPageInput .editFormText_disabled, .editFormText:disabled {
    border-color: var(--rdy_sys_color_border_lowEmphasis_onLight);
    background: var(--rdy_sys_color_surface_lightDarker);
    cursor: default;
    color: var(--rdy_sys_color_action_monochrome_disabled_onLight);
}

.loginPageInput > button {
    position: absolute;
    right: 8px;
    bottom: 6px;
    width: var(--clickable-item-compact-width);
    height: var(--clickable-item-compact-height);
    padding: 0;
    border: 1px solid transparent;
    border-radius: 1000px;
    background: none;
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
    font-size: 16px;
    cursor: pointer;
}

.loginPageInput > button:hover,
.merc-captcha-image-wrapper > button:hover {
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
    background-color: var(--rdy_sys_color_hover_onLight);
}

.loginPageInput > button:focus,
.merc-captcha-image-wrapper > button:focus {
    outline: none;
    border-color: var(--rdy_sys_color_surface_light);
    -webkit-box-shadow: inset 0 0 0 2px var(--rdy_sys_color_focusBorder_onLight);
    box-shadow: inset 0 0 0 2px var(--rdy_sys_color_focusBorder_onLight);
}

.loginPageInput > button > .icon-Eye_18::before {
    content: "\e93a";
}

.loginPageInput > button.maskedPassword > .icon-Eye_18::before {
    content: "\e956";
}

.loginButtonsPane .punchLoginButtons .clockButton > .icon-request,
.login-fieldset .loginPageButton .login-punch-button > .icon-request,
.loginButtonsPane .punchLoginButtons .clockButton > .icon-clock-in,
.login-fieldset .loginPageButton .login-punch-button > .icon-clock-in,
.loginButtonsPane .punchLoginButtons .clockButton > .icon-clock-out,
.login-fieldset .loginPageButton .login-punch-button > .icon-clock-out,
.loginButtonsPane .punchLoginButtons .clockButton > .icon-transfer,
.login-fieldset .loginPageButton .login-punch-button > .icon-transfer,
.loginButtonsPane .punchLoginButtons .clockButton > .icon-pay,
.login-fieldset .loginPageButton .login-punch-button > .icon-pay,
.loginButtonsPane .punchLoginButtons .clockButton > .icon-questionnaire,
.login-fieldset .loginPageButton .login-punch-button > .icon-questionnaire {
    font-size: 14px;
}

.loginButtonsPane .punchLoginButtons .clockButton > .icon-request::before,
.login-fieldset .loginPageButton .login-punch-button > .icon-request::before {
    content: "\e91f";
}

.loginButtonsPane .punchLoginButtons .clockButton > .icon-clock-in::before,
.login-fieldset .loginPageButton .login-punch-button > .icon-clock-in::before {
    content: "\e92c";
}

.loginButtonsPane .punchLoginButtons .clockButton > .icon-clock-out::before,
.login-fieldset .loginPageButton .login-punch-button > .icon-clock-out::before {
    content: "\e92d";
}

.loginButtonsPane .punchLoginButtons .clockButton > .icon-transfer::before,
.login-fieldset .loginPageButton .login-punch-button > .icon-transfer::before {
    content: "\e9c3";
}

.loginButtonsPane .punchLoginButtons .clockButton > .icon-pay::before,
.login-fieldset .loginPageButton .login-punch-button > .icon-pay::before {
    content: "\e92f";
}

.loginButtonsPane .punchLoginButtons .clockButton > .icon-questionnaire::before,
.login-fieldset .loginPageButton .login-punch-button > .icon-questionnaire::before {
    content: "\e9a5";
}

.inputFormWr .todoButtons label {
    display: inline-block
}

.login-fieldset .loginPageButton .primaryButton > span,
.login-fieldset .loginPageInput .label,
.login-fieldset div .login-checkbox span,
.descriptive-content .c-show-more-box__btn,
.inputFormWr .loginPageInput + .loginButtonsPane .primaryButton > span,
.inputFormWr .loginPageInput .label,
.inputFormWr .loginButtonsPane .primaryButton > span,
.inputFormWr .form-text a,
.inputFormWr #FldIdentityQuestion label div,
.inputFormWr .todoDisplay .extra-title h2,
.inputFormWr .clock-wrapper h3,
.inputFormWr .todoDescription .section h3,
.inputFormWr .todoButtons label,
.seekButton,
.inputFormWr .retrieveUsernameTitle,
.inputFormWr .secondaryButton.sentenceCaseBtn,
.inputFormWr .primaryButton.sentenceCaseBtn,
.inputFormWr .sentenceCaseDiv,
.inputFormWr .sentenceCaseTitle,
.modal-title,
.inputFormWr .separator.for-theme {
    text-transform: lowercase;
}

.login-fieldset .loginPageButton .primaryButton > span::first-letter,
.login-fieldset .loginPageInput .label::first-letter,
.login-fieldset div .login-checkbox span::first-letter,
.descriptive-content .c-show-more-box__btn::first-letter,
.inputFormWr .loginPageInput + .loginButtonsPane .primaryButton > span::first-letter,
.inputFormWr .loginPageInput .label::first-letter,
.inputFormWr .loginButtonsPane .primaryButton > span::first-letter,
.inputFormWr .form-text a::first-letter,
.inputFormWr .form-text span::first-letter,
.inputFormWr #FldIdentityQuestion label div::first-letter,
.inputFormWr .todoDisplay .extra-title h2::first-letter,
.inputFormWr .todoDescription .section h3::first-letter,
.inputFormWr .todoButtons label::first-letter,
.seekButton::first-letter,
.inputFormWr .retrieveUsernameTitle::first-letter,
.inputFormWr .secondaryButton.sentenceCaseBtn::first-letter,
.inputFormWr .primaryButton.sentenceCaseBtn::first-letter,
.inputFormWr .sentenceCaseDiv::first-letter,
.inputFormWr .sentenceCaseTitle::first-letter,
.modal-title::first-letter {
    text-transform: uppercase;
}

.errorClassInputType .fld,
.error .fld {
    position: relative;
    font-family: 'kronos-ready-icons';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.errorClassInputType .fld::before,
.error .fld::before {
    content: "\ea03";
    position: absolute;
    color: var(--rdy_sys_color_important);
    font-size: 16px;
    left: 8px;
    top: 50%;
    transform: translateY(-50%);
}

.errorClassInputType .editFormText,
.error .editFormText {
    padding-left: 32px !important;
    border-color: var(--rdy_sys_color_important);
}

.errorClassInputType .editFormText:focus,
.error .editFormText:focus {
    border-color: var(--rdy_sys_color_important);
    -webkit-box-shadow: inset 0 0 0 1px var(--rdy_sys_color_important);
    box-shadow: inset 0 0 0 1px var(--rdy_sys_color_important);
}
/* ===== END: Field styles ===== */

/* ===== START: Invalidbox styles ===== */
.invalidbox:not(:empty) {
    padding: 16px 24px;
    border-radius: 12px;
    border: 1px solid var(--rdy_sys_color_border_lowEmphasis_onLight);
    background: var(--rdy_sys_color_surface_light);
}

.invalidbox .invalidBoxMessage {
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
}

.invalidbox .invalidBoxMessage + .valid,
.invalidbox .invalidBoxMessage + .invalid,
.loginPageInput + .tooltip-password-wrapper {
    margin-top: 16px;
}

.invalidbox .valid,
.invalidbox .invalid {
    position: relative;
    padding: 5px 0 5px 28px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

.invalidbox .valid::before,
.invalidbox .invalid::before {
    position: absolute;
    top: 8px;
    left: 4px;
    border-radius: 50%;
    font-size: 12px;
}

.invalidbox .valid::before {
    content: "\e923";
    color: var(--rdy_sys_color_success);
}

.invalidbox .invalid::before {
    content: "\e97a";
    color: var(--rdy_sys_color_important);
}

.invalidbox .messagespan {
    display: inline-block;
}

.invalidbox .defaultPassMessage {
    margin: 16px 0;
    padding: 8px;
    background: #F5F5F5;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

.invalidbox + .loginPageInput,
#parentdiv + .loginPageInput {
    margin-top: 20px;
}

#confirmPasswordValidation:not(.invalidbox) > .valid {
    display: none;
}

/* ===== END: Invalidbox styles ===== */

/* ===== START: CAPTCHA styles ===== */
.loginPageInput + script + .merc-captcha-block.loginPageInput {
    margin-top: 32px;
}

.login-fieldset .merc-captcha-block .label {
    text-transform: none;
}

.merc-captcha-image-wrapper {
    display: flex;
    align-items: center;
    margin-top: 4px;
}

.merc-captcha-field {
    margin-top: 16px;
}

.merc-captcha-image-wrapper .merc-captcha-image {
    flex-grow: 1;
    height: 40px;
    margin-right: 8px;
    box-sizing: border-box;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.50);
    background: var(--rdy_sys_color_surface_lightDarkest);
}

.merc-captcha-image-wrapper .merc-captcha-image #captcha-img {
    height: 100%;
}

.merc-captcha-image-wrapper button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 34px;
    height: 34px;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    border-radius: 1000px;
    border: 1px solid transparent;
    background: none;
    cursor: pointer;
    font-size: 18px;
}

.merc-captcha-image-wrapper > button:active {
    background-color: var(--rdy_sys_color_active_onLight);
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

.merc-captcha-image-wrapper button:nth-of-type(1) {
    margin-right: 8px;
}

.merc-captcha-image-wrapper button i {
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
    
}

.merc-captcha-image-wrapper .icon-play-audio::before {
    content: '\e938';
}

/* ===== END: CAPTCHA styles ===== */

/* ===== START: Custom GOOGLE login button styles ===== */
.loginButtonsPane > .login-fieldset:has(.googleSignInCustomButton) {
  display: flex;
  justify-content: center;
}

.googleSignInCustomButton {
  margin-top: 20px;
  display: inline-flex;
  align-items: center;
  background-color: #fff;
  color: #1F1F1F;
  font-family: 'Roboto', Arial, sans-serif;
  font-weight: 500;
  -webkit-border-radius: 20px;
  border-radius: 20px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #747775;
  padding: 10px 12px;
  font-size: 14px;
  max-height: 40px;
  min-width: min-content;
  line-height: 20px;
  cursor: pointer;
  transition: box-shadow 0.2s ease;
  outline: none;
  -webkit-tap-highlight-color: transparent;

  &.m-ios {
    max-height: 44px;
    padding: 12px 16px;
    > .icon {
         margin-right: 12px;
    }
  }
}

.googleSignInCustomButton > .icon {
    overflow: hidden;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    background: url("/ta/images/btn_google_logo.svg ") center center / auto 18px no-repeat;
}


.googleSignInCustomButton:hover {
    box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .30), 0 1px 3px 1px rgba(60, 64, 67, .15);
    background-color: rgba(48, 48, 48, 0.08);
}

.googleSignInCustomButton:focus,
.googleSignInCustomButton:active {
    background-color: rgba(48, 48, 48, 0.12); 
}

.googleSignInCustomButton:focus-visible {
    box-shadow: 0 0 0 2px rgba(60, 64, 67, 0.3);
}
/* ===== END: Custom GOOGLE login button styles ===== */

/* ===== START: Login styles ===== */
#messagesContainer:not(:empty) {
    margin-top: 20px;
}

#messagesContainer {
    font-size: 14px;
}

.validationMessage:not(:empty) {
    margin-top: 20px;
    margin-bottom: 32px;
}

.validationMessage {
    position: relative;
    padding: 11px 20px 9px 68px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid transparent;
    line-height: 18px;
    letter-spacing: normal;
    word-break: break-word;
    word-wrap: break-word;
    color: rgba(0, 0, 0, 0.95);
    font-size: 14px;
}

.validationMessage::before {
    position: absolute;
    top: 9px;
    left: 25px;
    font-size: 18px;
}

.validationMessage.validationMessageError {
    border-color: #f8cfd3;
    background: #fdf2f3;
}

.validationMessage.validationMessageError::before {
    content: "\ea03";
    color: var(--rdy_sys_color_important);
}

.validationMessage.validationMessageWarning {
    border-color: #f5e2c9;
    background: #fcf6ed;
}

.validationMessage.validationMessageWarning::before {
    content: "\ea04";
    color: var(--rdy_sys_color_warning);
}

.validationMessage.validationMessageInfo {
    border-color: #dee4ff;
    background: #f4f6ff;
}

.validationMessage.validationMessageInfo::before {
    content: "\e93e";
    color: #667fff;
}

.primaryButton,
.secondaryButton {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    height: 44px;
    border: none;
    border-radius: 1000px;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: normal;
    cursor: pointer;
    transition: color 0.2s ease-out, background 0.2s ease-out;
}

.primaryButton:focus,
.secondaryButton:focus,
.seekButton:focus {
    outline: none;
}

.primaryButton:focus::before,
.secondaryButton:focus::before,
.seekButton:focus::before {
    content: "";
    position: absolute;
    inset: 1px;
    border-radius: inherit;
    border: 1px solid var(--rdy_sys_color_surface_light);
    -webkit-box-shadow: inset 0 0 0 2px var(--rdy_sys_color_focusBorder_onLight);
    box-shadow: inset 0 0 0 2px var(--rdy_sys_color_focusBorder_onLight);
}

.primaryButton {
    background: var(--color_theme_800);
    color: var(--color_theme_text_OnDark);

    &:hover {
            background: var(--color_theme_900);
        }
    &:active {
        background: var(--color_theme_1000);
    }
    &[disabled] {
        background: var(--rdy_sys_color_action_monochrome_disabled_onLight);
        color: var(--color_theme_text_OnDark);
        cursor: default;
    }
}

.secondaryButton {
    background: var(--color_theme_300);
    color: var(--color_theme_text_OnLight);

    &:hover {
        background: var(--color_theme_400);
    }
    &:active {
        background: var(--color_theme_500);
    }
    &[disabled] {
        background: var(--rdy_sys_color_surface_disabled_onLight);
        color: var(--rdy_sys_color_text_disabled_onLight);
        cursor: default;
    }
}

.login-checkbox {
    position: relative;
    display: inline-block;
    overflow: hidden;
    min-height: 28px;
}

.login-checkbox > input {
    z-index: 1;
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    pointer-events: none;
}

.login-checkbox > input:checked + b::before {
    content: "\e906";
    color: var(--rdy_sys_color_action_enabled);
}

.login-checkbox > input:focus ~ .login-checkbox-label::before {
    content: "";
}

.login-checkbox > input:hover:not([disabled]):not([readonly]) ~ .login-checkbox-label {
    background: rgba(0, 0, 0, 0.05);
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

.login-checkbox > input:hover:not([disabled]):not([readonly]) + b::before {
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

.login-checkbox > input:checked:hover:not([disabled]):not([readonly]) + b::before {
    color: var(--rdy_sys_color_action_hover);
}

.login-checkbox > input[disabled] + b::before {
    color: var(--rdy_sys_color_action_monochrome_disabled_onLight);
}

.login-checkbox > input[disabled] ~ .login-checkbox-label {
    color: var(--rdy_sys_color_text_disabled_onLight);
    cursor: default;
}

.login-checkbox > b {
    position: absolute;
    top: 14px;
    left: 14px;
    border-radius: 2px;
    background: var(--rdy_sys_color_surface_light);
    font-size: 0;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.login-checkbox > b::before {
    content: "\e907";
    text-transform: none;
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
    font-family: "kronos-ready-icons";
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none;
}

.login-checkbox > .login-checkbox-label {
    display: block;
    position: relative;
    overflow: hidden;
    min-width: inherit;
    max-width: 100%;
    height: inherit;
    min-height: inherit;
    padding: 4px 4px 4px 28px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 4px;
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    cursor: pointer;
}

.login-checkbox > .login-checkbox-label::before {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    border: 1px solid var(--rdy_sys_color_surface_light);
    -webkit-box-shadow: inset 0 0 0 2px var(--rdy_sys_color_focusBorder_onLight);
    box-shadow: inset 0 0 0 2px var(--rdy_sys_color_focusBorder_onLight);
    outline: 3px solid transparent;
}

.header {
    text-align: center;
    padding: 80px 32px;

    @media screen and (min-width: 1018px) {
        padding-right: 80px;
        padding-left: 80px;
    }
}

.header:empty {
    padding-top: 60px;
    padding-bottom: 60px;
}

.header .company-logo {
    font-size: 0;
}

.header .company-logo > img {
    max-height: 40px;
    font-size: 16px;
}

.header .company-logo + .company-description {
    margin-top: 12px;
    margin-bottom: -36px;
}

.company-logo.logo-background {
    display: inline-flex;
    
        background-color: transparent;
        padding: 0;
        border-radius: 0;
    ;
}

.header .company-description {
    font-size: 18px;
    line-height: 22px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.95);
    letter-spacing: -0.1px;
}

.form-text a {
line-height: 16px;
letter-spacing: normal;
}

.head-clock {
    display: inline-flex;
    padding: 4px 8px;
    border-radius: 6px;
    background: var(--rdy_sys_color_surface_disabled_onLight);
    justify-content: center;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    line-height: 16px;
    font-weight: 500;
    letter-spacing: 0px;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
    margin-top: 24px;
}

.clock-wrapper {
    display: flex;
    justify-content: center;
}

article {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    padding: 0 32px;
    max-width: 423px;

    @media screen and (min-width: 1018px) {
        max-width: 974px;
        padding: 0 80px;
    }

    @media screen and (max-width: 639.98px) {
        max-width: 375px;
    }
}

.white-container {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    width: 375px;
    padding: 0;
    border-radius: 16px;

    @media screen and (min-width: 640px) {
        padding: 48px 24px;
        background-color: var(--rdy_sys_color_surface_light);
    }
}

.white-container:has(.descriptive-content) {
    flex: 1;
    justify-content: space-between;
}

.white-container > aside {
    max-width: 375px;
    flex-grow: 1;
}

#loginPage.theme-merc .loginPageInput.custom-select table {
    position: relative;
}

.white-container > aside + .descriptive-content {
    margin-top: 40px;
}

.descriptive-content {
    overflow: hidden;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
    letter-spacing: normal;

    @media screen and (min-width: 1018px) {
        padding-top: 24px;
    }
}

.descriptive-content:first-child,
.descriptive-content:nth-child(2) {
    @media screen and (max-width: 1017.98px) {
        display: none;
    }
}

.descriptive-content:last-child {
    @media screen and (min-width: 1018px) {
        display: none;
    }
}

.descriptive-content img {
    max-width: 100%;
    height: auto;
}

.descriptive-content strong {
    font-weight: bold;
}

.descriptive-content em {
    font-style: italic;
}

.descriptive-content .lm.hidden {
    display: none;
}

.form-content:first-child:last-child {
    margin: 0 auto;
}

.form-content .extra-title,
.form-content .extra-title-saml,
.form-content .retrieveUsernameTitle  {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    column-gap: 4px;
    font-size: 26px;
    line-height: 32px;
    font-weight: 600;
    color: var(--color_theme_1000);
    letter-spacing: -0.3px;
}

.form-content .extra-title > h1 {
    text-transform: lowercase;
}

.form-content .extra-title > h1::first-letter {
    text-transform: uppercase;
}

.form-content .extra-title:not(:empty) + .login,
.form-content .extra-title-saml:not(:empty) + .login,
.login-fieldset {
    margin-top: 32px;
}

.login-fieldset + .form-text {
    margin-top: 20px;
}

.inputFormWr > .clock-login-title {
    margin-top: 40px;
}

.login-fieldset > div:has(> .login-checkbox) {
    margin-top: 16px;
    font-size: 0;
}

.login-fieldset > .question-title,
.inputFormWr > .clock-login-title {
    font-size: 23px;
    line-height: 28px;
    font-weight: 600;
    letter-spacing: -0.2px;
    color: var(--color_theme_1000);
    text-transform: lowercase;
    text-align: center;
}

.login-fieldset > .question-title::first-letter,
.inputFormWr > .clock-login-title::first-letter {
    text-transform: uppercase;
}

.login .inputForm .inputFormWr > .clock-login-title + .login-fieldset {
    margin-top: 0;
}

.login-fieldset > .question-title + .question,
.clock-wrapper ~ section.login .inputFormWr > .login-fieldset,
.clock-wrapper ~ section.login.careers-aside,
.clock-wrapper ~ script ~ section.login.careers-aside {
    margin-top: 12px;
}

.inputFormWr > .clock-login-title + .login-fieldset .loginPageInput:first-of-type,
.inputFormWr > .clock-login-title + .login-fieldset .loginPageButton:first-of-type {
    margin-top: 16px;
}

.login-fieldset > .question {
    padding-top: 1px;
    padding-bottom: 1px;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
}

.login-fieldset > .question + .loginPageInput {
    margin-top: 4px;
}

.inputForm a {
    display: inline-block;
}

.forgot-password-link {
    text-align: center;
}

.form-text + .separator,
.forget-field-wrapper + .separator,
.primaryButton + .separator,
.separator + .punchLoginButtons,
.separator + .login-fieldset,
.separator + .loginPageButton,
.login-fieldset + .separator,
.loginButtonsPane + .forgot-password-link,
.loginButtonsPane ~ .form-text,
.loginPageButton + .separator,
.forget-password + p + .separator {
    margin-top: 20px;
}

.separator {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 18px;
    height: 16px;
}

.separator::before,
.separator::after {
    content: "";
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 1px;
    background: var(--rdy_sys_color_border_midEmphasis_onLight);
}

.separator > span {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 21px;
    height: 100%;
    text-align: center;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
}

.separator[style*="display:none"] + .loginButtonsPane,
.separator[style*="display: none"] + .loginButtonsPane,
.loginButtonsPane > .login-fieldset:first-child,
.loginButtonsPane:empty,
.loginButtonsPane:has(> fieldset:empty) {
    margin-top: 0;
}

.center-copy {
    text-align: center;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
}

.icon-Help_16,
.icon-Info_16,
.icon-Page_copy_18,
.pointer {
  cursor: pointer;
}

/* ===== END: Login styles ===== */

/* ===== START: Icon styles ===== */

.invalidbox .valid::before,
.invalidbox .invalid::before,
.validationMessage::before,
[class^="icon-"], [class*=" icon-"],
.clock-log__icon,
.modal-head i,
.icon-xmark,
.merc-tooltip-icon i {
    text-transform: none;
    font-family: "kronos-ready-icons";
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    speak: none;
}

.icon-Reload_16::before {
    content: '\e939';
}

.icon-Sorting-down_8:before {
    content: "\e90f";
}

.icon-Help_16, .icon-Info_16 {
    font-size: 16px;
}

.icon-Page_copy_18 {
    font-size: 18px;
}

.icon-Help_16:before {
    content: "\e900";
}

.icon-Page_copy_18:before {
    content: "\e960";
}

.icon-Edit:before {
    content: "\e954";
}

/* ===== END: Icon styles ===== */

/* ===== START: Combobox styles ===== */

.cbOuterDiv {
    margin-right: 20px;
    font-size: 14px;
    font-weight: 400;
    height: auto !important;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
    line-height: 18px;
    box-sizing: border-box;
    border: 1px solid var(--rdy_sys_color_border_highEmphasis_onLight);
    z-index: 99;
    overflow-x: hidden;
    background-color: white;
    display: none;
    position: absolute;
    overflow-y: auto;
}

.cbInnerDivSel, .cbInnerDiv {
    min-height: 35px !important;
    padding: 9px 16px 8px;
    width: 100%;
    box-sizing: border-box;
    cursor: pointer;
}

.cbOuterDiv:empty {
  display: none !important;
}

/* ===== END: Combobox styles ===== */
/* ===== Start: Main Careers Page styles ===== */

/* ===== START: ShowMoreBox styles ===== */

.c-show-more-box {
    padding-left: 14px;
    margin-left: -14px;

    .c-show-more-box__text-wrapper {
        max-height: 365px;
        transition: max-height 3s ease;

        &.m-expanded {
            max-height: none;

            + .c-show-more-box__btn::after {
                content: "\e911";
            }
        }
    }

    .c-show-more-box__btn {
        display: none;
        position: relative;
        min-height: 34px;
        margin-left: -6px;
        padding-right: 22px;
        font-size: 14px;
        font-weight: 600;
        line-height: 26px;
        position: relative;
        margin-top: 12px;
        color: var(--rdy_sys_color_text_action_enabled);
        background: none;
        border: none;
        cursor: pointer;

        &:focus {
            outline: none;
        }

        &::before {
            position: absolute;
            top: 50%;
            right: -8px;
            left: -8px;
            height: 100%;
            min-height: 34px;
            padding: 2px 0;
            box-sizing: border-box;
            transform: translateY(-50%);
            border-radius: 17px;
        }

        &:focus::before {
            border: 1px solid #fff;
            box-shadow: inset 0 0 0 2px var(--rdy_sys_color_focusBorder_onLight);
            outline: 3px solid transparent;
            content: "";
        }

        &::after {
            position: absolute;
            font-family: "kronos-ready-icons";
            content: "\e90b";
            display: inline-block;
            margin-left: 6px;
            font-size: 10px;
            vertical-align: middle;
            transition: transform 0.3s ease;
        }
    }
}

/* ===== END: ShowMoreBox styles ===== */

.header-container {
    position: relative;
    padding: 20px 0 0;
}

/* If Careers Page header has a language selector */
.header-container:has(#FldLanguageOverride) {
    @media screen and (max-width: 719.98px) {
        padding-bottom: 68px;
    }
}

/* If the Careers Page header doesn't include a company name */
.header-container:has(.dba-title span:empty) {
    padding-top: 40px;
    padding-bottom: 24px;
}

.header-container .header:only-child {
    padding-top: 20px;
    padding-bottom: 24px;

    @media screen and (max-width: 719.98px) {
        padding-bottom: 0;
    }
}

.header-container .header {
    padding: 0 32px;
}

.header-container .company-description {
    overflow: hidden;
    max-width: 344px;
    margin-right: auto;
    margin-left: auto;
}
.header-container .header > .company-description {
    margin-top: 12px;
    margin-bottom: 0;
}
.header-container .company-logo + .company-description:empty {
    margin-top: 0;
}

.header-container #FldLanguageOverride {
    position: absolute;
    top: 50%;
    right: 56px;
    height: 44px;
    transform: translateY(-50%);

    @media screen and (max-width: 719.98px) {
        top: auto;
        right: 32px;
        bottom: 0;
        transform: none;
    }
}

#FldLanguageOverride .dropdown {
    border-radius: 12px;
}

#FldLanguageOverride .dropdown_element {
    display: inline-block;
    max-width: 102px;
    height: 44px;
}

#FldLanguageOverride .dropdown_toggle {
    border-color: var(--rdy_sys_color_border_midEmphasis_onLight);
    border-radius: 12px;
    padding: 13px 12px;
    background-color: transparent;
    gap: 6px;
}

.header-container + article {
    margin-top: 24px;

    @media screen and (max-width: 719.98px) {
        margin-top: 32px;
    }
}

.header-wrapper__job > .dba-title span:not(:empty) {
    display: block;
    margin-top: 4px;
    padding: 10px 32px;
    border-bottom: 1px solid var(--rdy_sys_color_border_midEmphasis_onLight);
    text-align: center;
    letter-spacing: 0;
    color: var(--color_theme_1000);
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
}

.clock-wrapper + script + .question-block {
    margin-top: 20px;
}
.question-block {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.question-block__prompt {
    font-size: 18px;
    line-height: 22px;
    letter-spacing: -0.1px;
    font-weight: 600;
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

.question-block__info {
    line-height: 24px;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
}

.forget-field-wrapper > .form-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;

    @media screen and (min-width: 640px) {
        flex-direction: row;
        gap: 0;
    }
}

.forget-field-wrapper .forget-password,
.forget-field-wrapper .forget-username {
    flex: 1;
    position: relative;
    display: flex;
    justify-content: center;
}

.forget-field-wrapper .forget-username::after {
    content: "";
    display: none;
    position: absolute;
    top: 50%;
    right: 0;
    width: 1px;
    height: 12px;
    background-color: var(--rdy_sys_color_border_midEmphasis_onLight);
    transform: translateY(-50%);

    @media screen and (min-width: 640px) {
        display: block;
    }
}
.forget-field-wrapper .forget-username:only-child::after {
    content: none;
}

.forget-field-wrapper > .forget-username::after {
    content: none;
}

section.login.careers-aside .secondaryButton {
    margin-top: 20px;
}
/* ===== END: Main Careers Page styles ===== */
/* ===== Start: Biometric Login Buttons styles ===== */
.loginButtonsPane #other-login-opts-fieldset {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#other-login-opts-fieldset script + .loginPageButton {
    margin-top: 0px;
}

.sso-button {
    margin-top: 20px;
}

.loginPageButton .finger-print-btn,
.loginPageButton .face-id-btn {
    display: none;
    width: auto;
    margin: 20px auto 0;
    padding: 12px;
    background-color: transparent;
    color: var(--rdy_sys_color_text_action_enabled);
}

.loginPageButton .primaryButton.finger-print-btn > span,
.loginPageButton .primaryButton.face-id-btn > span {
    text-transform: none;
}

.loginPageButton .finger-print-btn i,
.loginPageButton .face-id-btn i {
    color: var(--rdy_sys_color_action_enabled);
    font-size: 20px;
}

.icon-touch-id-ios::before {
    content: "\e970";
}
.icon-touch-id-android::before {
    content: "\e992";
}

.icon-face-id-ios::before {
    content: "\e991";
}

.icon-face-id-android::before {
    content: "\e990";
}

.loginPageButton.has-finger-print .finger-print-btn {
    display: flex;
}

.loginPageButton.has-finger-print.m-ios .finger-print-btn .icon-touch-id-android {
    display: none;
}

.loginPageButton.has-finger-print.m-android .finger-print-btn .icon-touch-id-ios {
    display: none;
}

.loginPageButton.has-face-id input.primaryButton,
.loginPageButton.has-face-id .face-id-btn {
    display: flex;
}

.loginPageButton.has-face-id.m-ios .face-id-btn .icon-face-id-android {
    display: none;
}

.loginPageButton.has-face-id.m-android .face-id-btn .icon-face-id-ios {
    display: none;
}
/* ===== End: Biometric Login Buttons styles ===== */
/* ================== Careers Create Account Page ================== */
.create-account-container .loginPageInput + .loginPageInput,
.create-account-container input + .countryPane,
.create-account-container .countryPane + .loginPageInput,
.create-account-container .loginPageInput + .resumePane,
.create-account-container .resumePane + .loginButtonsPane,
.tooltip-password-wrapper + .loginPageInput,
.create-account-container .loginButtonsPane + .form-text.bottom-link,
.create-account-container #overlay + .form-text.bottom-link {
    margin-top: 20px;
}

.tooltip-password-wrapper {
    position: relative;
}

.tooltip-password-wrapper .label {
    margin-right: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.label-tooltip-wrapper {
    display: flex;
}

#loginPage.theme-merc .tooltip-password-wrapper .merc-tooltip-wrapper,
.tooltip-password-wrapper .merc-tooltip-wrapper {
    width: 28px;
    height: 28px;
    border: 2px solid transparent;
    cursor: pointer;
}

#loginPage.theme-merc .create-account-container .merc-tooltip-wrapper button:focus:not(:active) {
    border-color: #016fa7;
}

#loginPage.theme-merc .tooltip-password-wrapper .merc-tooltip-wrapper .merc-tooltip-icon {
    width: inherit;
    height: inherit;
    cursor: inherit;
}

#loginPage.theme-merc .merc-tooltip-icon i.icon-circle-question {
    width: auto;
    height: auto;
    font-size: 16px;
    position: static;
    top: 0;
    padding: 5px;
    background-color: transparent;
}

#loginPage.theme-merc .tooltip-password-wrapper .merc-tooltip-icon i.icon-circle-question {
    font-size: 14px;
}

#loginPage.theme-merc .txt-checkbox span:first-child {
padding-left: 8px;
line-height: 20px;
color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

.icon-circle-question {
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
    font-size: 14px;
}

#loginPage.theme-merc .merc-tooltip-wrapper .merc-tooltip-icon:hover .icon-circle-question {
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
}

.icon-circle-question::before {
    content: "\e93e";
}

#NewPassword_Tooltip .merc-tooltip-close-btn {
    cursor: pointer;
}

#NewPassword_Tooltip .merc-tooltip-close-btn .icon-xmark {
    font-size: 14px;
}

#NewPassword_Tooltip .merc-tooltip-close-btn .icon-xmark::before {
    content: "\e93c";
}

#FldCountry {
    margin-top: 4px;
}

.inputFile {
    display: none;
}

.resumePane {
    display: flex;
    flex-direction: column;
    margin-left: -8px;
}
.resumePane .form-text:first-child {
    display: flex;
    align-items: center;
}

.resumePane .primaryButton {
    height: auto;
    width: auto;
    padding: 13px 12px;
    background-color: transparent;
    color: var(--rdy_sys_color_text_action_enabled);
    gap: 6px;
}

.resumePane .context-info__tooltip > button {
    height: auto;
    padding: 4px;
    border: none;
    cursor: pointer;
    background-color: transparent;
    border-radius: 9999px;
}

.resumePane .context-info__tooltip > button:focus {
    outline-color: #016fa7;
}

.resumePane .icon-circle-question {
    padding: 10px;
}

.resumePane .icon-Export_16 {
    color: var(--rdy_sys_color_text_action_enabled);
    font-size: 12px;
}

.resumePane .icon-Export_16::before {
    content: "\e953";
}

#FldNewResume .inputFileWrapper .editFormText:not(:empty) {
    display: inline-block;
    overflow: hidden;
    max-width: 140px;
    box-sizing: border-box;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #016FA7;
    font-size: 12px;
    padding: 13px 12px;
    border-radius: 9999px;
    vertical-align: middle;
}

#FldNewResume .inputFileWrapper .editFormText:focus {
    outline-color: var(--rdy_sys_color_text_action_enabled);
}

#DownloadResumeTemplate {
    display: inline-flex;
    align-items: center;
    padding: 13px 12px;
    gap: 6px;
    text-decoration: none;
    font-weight: 600;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: -0.3px;
    text-align: center;
}

#DownloadResumeTemplate::before {
    right: 0;
    left: 0;
}

#DownloadResumeTemplate .icon-Download_16 {
    font-size: 12px;
}

#DownloadResumeTemplate .icon-Download_16::before {
    content: "\e959";
}

#resumeTooltip {
    border-radius: 4px;
    background: #004466;
    border: none;
}

/* ================== End of Careers Create Account Page ================== */

/* ================== Start Forgot Username Page ================== */

#FldDateOfBirth {
    position: relative;
}

#FldDateOfBirth .hasFormBtn input,
#FldDateOfBirth .hasFormBtn input::placeholder {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0px;
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

#FldDateOfBirth a:focus::before {
    right: -1px;
    left: -1px;
}

#DateOfBirth_LKP {
    position: absolute;
    top: 50%;
    right: 8px;
    padding: 6px;
    text-decoration: none;
    transform: translateY(-50%);
    border-radius: 1000px;
}

.icon-calendar_03_16 {
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
    font-size: 16px;
}

.icon-calendar_03_16::before {
    content: "\e904";
}

#FldSelectYesNo {
    display: block;
}

#FldIdentityQuestion #question,
#FldSelectYesNo select {
    appearance: none;
    outline-color: var(--rdy_sys_color_focusBorder_onLight);
}

#FldIdentityQuestion > div,
#FldSelectYesNo > div {
    position: relative;
}

#FldIdentityQuestion label,
#FldSelectYesNo label {
    font-size: 10px;
}

#FldIdentityQuestion label::before,
#FldSelectYesNo label::before {
    position: absolute;
    right: 16px;
    bottom: 15px;
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
    pointer-events: none;
    content: "\e90f";
    font-family: "kronos-ready-icons";
}

input[name="FullNationalIdNo"] + .loginPageButton {
    margin-top: 32px;
}

.btn-meta {
min-width: 34px;
height: 44px;
line-height: 42px;
padding: 0 8px;
white-space: nowrap;
overflow: visible;
font: inherit;
}

.btn-meta.low {
height: 34px;
line-height: 32px;
}

.extra-title + .c-inline-messages__wrap,
.extra-title-saml + .c-inline-messages__wrap {
    margin-top: 20px;
}

.c-inline-messages__wrap + section {
    margin-top: 32px;
}

.c-inline-messages__wrap {
    padding: 10px 34px 10px 24px;
    border: 1px solid var(--rdy_sys_color_surfaceBorder_success);
    background-color: var(--rdy_sys_color_surface_success);
}

.c-inline-messages__group {
    display: flex;
    align-items: flex-start;
    gap: 26px;
    font-weight: 400;
    font-size: 14px;
    line-height: 16px;
}

.c-inline-messages__group i {
    font-size: 18px;
    color: var(--rdy_sys_color_success);
}

.c-inline-messages__group i::before {
    content: "\e919";
}

.retrieveUsernameTitle ~ .loginPageInputRadioWr,
.mMessageMargin10Bottom ~ .loginPageInputRadioWr {
    color: #000000F2;
}

#FldUsername .editFormText_disabled, #FldUsername:disabled {
    border-color: rgba(0, 0, 0, 0.47);
    background: var(--rdy_sys_color_surface_light);
}

#FldUsername .editFormText_disabled:focus {
    box-shadow: none;
}

.form-content .retrieveUsernameTitle {
    display: block;
    text-align: center;
}

.forgot-label {
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}
/* ================== End Forgot Username Page ================== */
/* ================== Start: Radio Buttons styles ================== */

.loginPageInputRadioWr {
    margin-top: 16px;
    font-size: 16px;
    line-height: 24px;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
}

.loginPageInputRadioWr + .loginPageInputRadioWr {
    margin-top: 8px;
}

.loginPageInputRadioWr tr {
    padding: 4px;
}

.loginPageInputRadioWr .radioButton {
    display: flex;
    align-items: center;
}

#authenticationOptions tr,
.loginPageInputRadioWr > table tr {
    display: flex;
    align-items: center;
    gap: 8px;

    &:not(:first-child) {
        margin-top: 8px;
    }
}

.editFormCheckbox {
    width: 18px;
    height: 18px;
    margin: 0;
    font-family: "kronos-ready-icons";
    
    &:checked::before {
        color: var(--rdy_sys_color_action_enabled);
    }
    &::before {
        border-radius: 2px;
        background: var(--rdy_sys_color_surface_light);
        color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
        font-size: 18px;
    }
}

.editFormCheckbox[type="radio"] {
    &:checked::before {
        content: "\e91d";
    }
    &::before {
        content: "\e91e";
        border-radius: 50%;
    }
}

.editFormCheckbox[type="checkbox"] {
    &:checked::before {
        content: "\e906";
    }
    &::before {
        content: "\e907";
    }
    
    &:focus-visible {
        outline: none;
    }
    
    &:focus::before {
        outline: 1px solid var(--rdy_sys_color_surface_light);
        box-shadow: 0 0 0 3px var(--rdy_sys_color_focusBorder_onLight);
    }
}

.loginPageInputRadioWr + .loginPageButton {
    margin-top: 32px;
}
/* ================== END: Radio Buttons styles ================== */
/* ================== Start: Careers Apply to Job Page ================== */
.header-container + .header-wrapper__job-application-item {
    margin-top: 32px;
}

article:has(.header-wrapper__job-application-item) {
    @media screen and (max-width: 719.98px) {
        margin-top: 12px;
    }
}

.header-wrapper__job-application-item ~ .c-show-more-box {
    margin-top: 87px;
}

.header-wrapper__job-application-item ~ .form-content {
    margin-top: 32px;
    
    @media screen and (min-width: 1018px) {
        margin-top: 82px;
    }
}

.header-wrapper__job-application-item + .form-content {
    margin-top: 32px;
}

.header-wrapper__job-application-item {
    flex: 1 1 100%;
    margin-top: -44px;
    text-align: center;

    @media screen and (max-width: 639.98px) {
        margin-top: 0;
    }
}

.header-wrapper__job-application-item-details {
    margin: 0 auto;
    max-width: 375px;
    display: inline-block;
    padding: 12px 32px;
    box-sizing: border-box;
    background-color: var(--rdy_sys_color_surface_lightDark);
    border-radius: 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: rgba(0, 0, 0, 0.95);

    @media screen and (min-width: 1018px) {
        max-width: none;
    }
}

.seekButton,
.seekButton + .loginPageButton {
    margin-top: 20px;
}

.seekButton {
    position: relative;
    display: inline-block;
    width: 100%;
    padding: 7px 6px;
    border: none;
    border-radius: 5000px;
    font-size: 16px;
    line-height: 18px;
    font-weight: 600;
    cursor: pointer;
    color: var(--rdy_sys_color_text_highEmphasis_onDark);
    transition: background-color 0.2s ease-out;
    background-color: #E41479;

    &:hover {
        background: #fd0585;
        box-shadow: 0 1px 2px 0 rgba(64, 64, 64, 0.4);
    }
}

.seek-apply-btn__image {
    display: inline-block;
    margin-left: 4px;
    height: 28px;
    width: 65px;
    vertical-align: middle;
    background: url('./images/seek-logo-blue.svg') no-repeat;
    background-size: 100% 100%;
}
/* ================== END: Careers Apply to Job Page ================== */
/* ================== Start: Attestation Page ================== */
.todoDescription {
    width: 100%;
}

.todoDescription br {
    display: none;
}

.clock-log {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 8px;
    padding: 0;
    list-style: none;
}

.clock-log__entry {
    display: flex;
    align-items: center;
    gap: 8px;
}

.clock-log__icon {
    font-size: 18px;
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
}

.clock-log__icon--in::before {
    content: "\e92c";
}

.clock-log__icon--out::before {
    content: "\e92d";
}

.clock-log__label,
.attestation-question {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
}

.clock-log__label {
color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

.attestation-question {
color: rgba(0, 0, 0, 0.95);
}

#ClockLog {
    box-sizing: border-box;
    width: 100%;
    display: block;
    padding: 8px 12px;
    border-radius: 12px;
    background-color: var(--rdy_sys_color_surface_light);
}

#ClockLog h3 {
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    color: rgba(0, 0, 0, 0.95);
}

.section.txtLabel + .section.txtLabel {
    margin-top: 16px;
}

.section.txtLabel + .attestation-question {
    margin-top: 32px;
}

.todoDescription + .todoButtons {
    margin-top: 20px;
}

.todoButtons > .section {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

#FldWFNewNote textarea {
    box-sizing: border-box;
    height: 90px;
    resize: none;
    padding: 8px 16px;
    background-color: var(--rdy_sys_color_surface_light);
    border: 1px solid #00000078;
    border-radius: 8px;
}

#dialogActionButtons {
    display: flex;
    flex-direction: column;
    margin-top: 16px;
    gap: 16px;
}
/* ================== End: Attestation Page ================== */
/* ================== Start: Careers Custom Modal styles ================== */
.custom-modal ._screen {
    display: none;
}

.custom-modal ._screen.visible {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9999;
    background-color: var(--rdy_sys_color_scrim);
}

.custom-modal ._overlay {
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 32px;
}

.custom-modal ._copy {
    display: flex;
    justify-content: center;
    width: 100%;
}

.custom-modal .msg {
    position: relative;
    flex: 1;
    max-width: 455px;
    min-height: 140px;
    background-color: var(--rdy_sys_color_surface_light);
    border-radius: 8px;
}

.custom-modal .msg:focus,
.custom-modal .msg:focus-visible {
    outline: none;
}

.custom-modal .modal-head.info,
.custom-modal .modal-head.success,
.custom-modal .modal-head.warning,
.custom-modal .modal-head.error {
    display: flex;
    padding: 15px 20px 0 30px;
    gap: 15px;
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
    letter-spacing: -0.4px;
    color: #000;
    border-top: 10px solid transparent;
    border-radius: 8px;
}

.modal-head > i {
    height: 24px;
    font-size: 57px;
}

.modal-head.success i {
    color: var(--rdy_sys_color_success);
}

.modal-head.info i {
    color: var(--rdy_sys_color_info);
}

.modal-head.warning i {
    color: var(--rdy_sys_color_warning);
}

.modal-head.error i {
    color: var(--rdy_sys_color_important);
}

.modal-head.info i::before {
    content: "\e913";
}

.modal-head.success i::before {
    content: "\e922";
}

.modal-head.warning i::before {
    content: "\e928";
}

.modal-head.error i::before {
    content: "\e942";
}

.custom-modal .modal-head.info {
    border-color: var(--rdy_sys_color_info);
}

.custom-modal .modal-head.success {
    border-color: var(--rdy_sys_color_success);
}

.custom-modal .modal-head.warning {
    border-color: var(--rdy_sys_color_warning);
}

.custom-modal .modal-head.error {
    border-color: var(--rdy_sys_color_important);
}

.modal-body .progress-bar {
    position: absolute;
    bottom: 23px;
    height: 14px;
    left: 102px;
    right: 53px;
    overflow: hidden;
    background-color: var(--rdy_sys_color_surface_lightDarker);
    border-radius: 8px;
}

.modal-body .progress-bar::before {
    display: block;
    position: absolute;
    content: "";
    height: 100%;
    width: 75px;
    border-radius: 8px;
    background-color: var(--rdy_sys_color_info);
    animation: progress-bar 1.2s linear infinite;
}

.modal-body .content:empty {
    display: none;
}

.modal-body .content {
    margin-top: 8px;
    padding: 0 20px 0 102px;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

.custom-modal .primaryButton,
.custom-modal .secondaryButton {
    height: 32px;
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
}

.custom-modal .modal-footer.buttons .secondaryButton {
    margin-top: 0;
}

.modal-footer.buttons {
    margin-top: 20px;
    padding: 0 20px 20px 0;
    gap: 12px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.modal-footer.buttons .secondaryButton,
.modal-footer.buttons .primaryButton {
    max-width: 90px;
}

@keyframes progress-bar {
    0% {
        left: 0;
        width: 0;
    }

    20% {
        left: 0;
        width: 75px;
    }

    100% {
        left: 100%;
    }
}

/* ================== End: Careers Custom Modal styles ================== */
/* ================== START: Set Up Security Question Page styles ================== */
.loginPageInput > .label-tooltip-wrapper {
    display: block;
}

.label-tooltip-wrapper > label {
    display: flex;
    align-items: center;
    margin-top: 4px;
}

#FldEnterASecurityQuestion ~ .merc-tooltip-icon i.icon-circle-question {
    font-size: 16px;
}

#FldEnterASecurityQuestion {
    display: flex;
    align-items: center;
    gap: 1px;
}

#FldEnterASecurityQuestion a:focus::before {
    right: 1px;
    left: 1px;
}

#FldEnterASecurityQuestion a:hover {
    text-decoration: none;
}

#FldEnterASecurityQuestion .icon-Help_16 {
    color: var(--rdy_sys_color_action_monochrome_enabled_onLight);
}

#FldEnterASecurityQuestion .icon-Help_16::before {
    content: "\e93e";
}

#securityQuestionInfo {
    line-height: 24px;
}

#securityQuestionInfo + .loginPageInput {
    margin-top: 16px;
}

#securityQuestion {
    margin-top: 40px;
    font-size: 16px;
    line-height: 24px;
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

#securityQuestion + .question {
    margin-top: 16px;
    padding: 0;
}

#question + .loginPageInput + .loginPageButton {
    margin-top: 32px;
}

#loginPage.theme-merc #EnterASecurityQuestion_Tooltip {
    padding: 16px 40px 16px 16px;
    font-size: 14px;
    line-height: 20px;
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
    background-color: var(--rdy_sys_color_surface_light);
    border: 1px solid var(--rdy_sys_color_border_lowEmphasis_onLight);
    box-shadow: 0px 0px 4px 0px #00000021,
    0px 3px 8px 0px #0000001A;
    background-color: var(--rdy_sys_color_surface_light);
    border-radius: 6px;
}

#loginPage.theme-merc #EnterASecurityQuestion_Tooltip .merc-tooltip-close-btn {
    padding: 9px;
    width: auto;
    height: auto;
    font-size: 10px;
    line-height: 1;
    border: none;
}

#loginPage.theme-merc #EnterASecurityQuestion_Tooltip .merc-tooltip-close-btn i {
    position: static;
    width: auto;
    height: auto;
    font-size: 10px;
    color: var(--rdy_sys_color_action_monochrome_lowEmphasis_enabled_onLight);
}

#loginPage.theme-merc #EnterASecurityQuestion_Tooltip .merc-tooltip-close-btn i::before {
    content: "\e93c";
}


#FldEnterASecurityQuestion + link + .merc-tooltip-wrapper .merc-tooltip-arrow {
    overflow: visible;
}

#FldEnterASecurityQuestion + link + .merc-tooltip-wrapper .merc-tooltip-arrow::after {
    top: -7px;
    background-color: var(--rdy_sys_color_surface_light);
    box-shadow: inset -1px -1px 0 0 var(--rdy_sys_color_border_lowEmphasis_onLight);
}

#loginPage.theme-merc #FldEnterASecurityQuestion ~ .merc-tooltip-wrapper .merc-tooltip-popover:focus,
#loginPage.theme-merc #FldEnterASecurityQuestion ~ .merc-tooltip-wrapper .merc-tooltip-popover.outline {
    box-shadow: 0 0 0 2px #016fa7;
    outline: none;
}

#loginPage.theme-merc #FldEnterASecurityQuestion ~ .merc-tooltip-wrapper .merc-tooltip-popover:focus + div::after,
#loginPage.theme-merc #FldEnterASecurityQuestion ~ .merc-tooltip-wrapper .merc-tooltip-popover.outline + div::after {
    box-shadow: inset -1px -1px 0 0 var(--rdy_sys_color_border_lowEmphasis_onLight);
    border-right: 2px solid var(--rdy_sys_color_action_enabled);
    border-bottom: 2px solid var(--rdy_sys_color_action_enabled);
}

/* ================== END: Set Up Security Question Page styles ================== */
/* ================== START: Identity Validation styles ================== */
#FldvalidateIdentity {
    margin-top: 4px;
}

.mFullWidth.mSelectContainerWidth.mIconBackground {
    margin-top: 32px;
} 

.mFullWidth.mSelectContainerWidth.mIconBackground + .loginPageInput,
.mFullWidth.mSelectContainerWidth.mIconBackground + #FldEmail {
    margin-top: 24px;
}

#Flddob .hasFormBtn,
#FldHireDate .hasFormBtn,
#FldTerminationDate .hasFormBtn {
    position: relative;
}
#dob_LKP, #HireDate_LKP, #TerminationDate_LKP {
    position: absolute;
    top: 50%;
    right: 8px;
    padding: 6px;
    text-decoration: none;
    transform: translateY(-50%);
    border-radius: 1000px;
}

#dob_LKP::before,
#HireDate_LKP::before,
#TerminationDate_LKP::before {
    right: -1px;
    left: -1px;
}

/* ================== END: Identity Validation styles ================== */
/* ================== START: Interim Logout styles ================== */
.interim-logout-text {
    margin-top: -8px;
    line-height: 24px;
    color: var(--rdy_sys_color_text_highEmphasis_onLight);
}

.interim-logout-text + .loginPageButton {
    margin-top: 20px;
}

/* ================== END: Interim Logout styles ================== */
/* ===== START: Footer styles ===== */

.copyWr {
    line-height: 18px;
    letter-spacing: normal;
}

/* ================== END: Footer styles ================== */
/* ================== START: OAuth Page styles ============ */
article:has(.oauth-authorization-form) {
    margin-bottom: 50px;
    @media screen and (min-width: 640px) {
        max-width: 475px;
    }
}

.white-container:has(.oauth-authorization-form) {
    width: auto;
    @media screen and (min-width: 640px) {
        padding: 56px;
    }
}

.white-container:has(.oauth-authorization-form) > aside {
    max-width: none;
}

.oauth-authorization-form {
    padding: 48px 24px;
    color: #000000F2;
    background-color: var(--rdy_sys_color_surface_light);
    border-radius: 16px;
}

.oauth-authorization-title {
    font-size: 23px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: -0.2px;
}

.oauth-authorization-title + .oauth-authorization-info {
    margin-top: 32px;
}

.oauth-authorization-info {
    line-height: 24px;
}

.oauth-authorization-info + .auth-list {
    margin-top: 20px;
}

.auth-list {
    padding-left: 28px;
}

.auth-item__heading {
    font-size: 18px;
    font-weight: 600;
    line-height: 22px;
    letter-spacing: -0.1px;
}

.auth-item__heading + .auth-item__text {
    margin-top: 2px;
}

.auth-item__text {
    font-size: 14px;
    line-height: 20px;
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
}

.auth-item + .auth-item {
    margin-top: 16px;
}

.auth-list + .responsive-div {
    margin-top: 40px;
}

.responsive-div {
    padding: 12px 16px;
    font-size: 12px;
    line-height: 18px;
    border-radius: 6px;
    background-color: var(--rdy_sys_color_surface_lightDarker);
}

.responsive-div-heading {
    font-weight: 600;
}

.responsive-div-heading + .responsive-div-text {
    margin-top: 2px;
}

.responsive-div-text {
    color: var(--rdy_sys_color_text_lowEmphasis_onLight);
}

.loginPref-button-container {
    margin-top: 14px;
    display: flex;
    gap: 8px;
}

/* ================== END: OAuth Page styles ============ */