div.bb-sso-container .bb-sso-button-default {
  display: flex;
  padding: 5px;
  margin: 5px 10px;
}
div.bb-sso-container .bb-sso-button-default div.bb-sso-button-label-container {
  display: none !important;
}
div.bb-sso-container.bb-sso-container-block .bb-sso-container-buttons {
  display: flex !important;
}
#login #bb-sso-custom-login-form-1 {
  /*margin-left: -50px;*/
  position: absolute;
  margin-top: -40px;
}
#bb-sso-custom-login-form-1 .bb-sso-separator {
  margin: 50px 0 -10px !important;
}
/* Center the BB SSO block relative to the form width */
#login {
  position: relative;
  /* anchor for the absolutely-positioned SSO block */
}
#login #bb-sso-custom-login-form-1 {
  left: 50%;
  transform: translateX(-50%);
  margin-left: 0 !important;
  /* overrides the -50px offset */
  /* keep your existing: position:absolute; margin-top:-50px; scale:80% */
}
/* Center the icon row itself (in case data-align/other CSS pushes it left) */
#bb-sso-custom-login-form-1 .bb-sso-container-buttons {
  justify-content: center !important;
}
/* Center the separator text */
#bb-sso-custom-login-form-1 .bb-sso-separator {
  text-align: center;
}
.sfr-login-register {
  color: #ec1e25 !important;
  font-weight: bold;
}
#login .sfr-login-register:hover {
  color: #000 !important;
}
/* Style the 2FA Screen */
.other_2fa_options {
  margin-top: -10px !important;
  margin-bottom: 30px;
}
#loginform ._2fa-info {
  color: #555;
}
.sfr-core-ui .button-primary {
  background: #ec1e25;
  border-color: #1a1a1a;
  color: #fff;
  text-decoration: none;
  text-shadow: none;
}
.sfr-core-ui .button, .sfr-core-ui .button-secondary {
  color: #ec1e25;
  border-color: #ec1e25;
  background: #f6f7f7;
  vertical-align: top;
}
#loginform .login .button-primary {
  margin-top: -52px;
  z-index: 99;
  position: relative;
}
div[data-sitekey="0x4AAAAAAAag7_e1d4RXSy58"] {
  opacity: 0.6;
}
#login_error, .login .message, .login .notice, .login .success {
  margin-top: 10px;
  margin-bottom: 20px;
}
#bb-otp-verify-page p:first-of-type {
  padding-left: 10px;
  padding-right: 10px;
}
/* Reset the form to normal flow 
#loginform {
    display: block;
}
*/
a {
  color: #ec1e25;
}
a:hover {
  color: #000;
  text-decoration: none;
}
/* target to the resend code  */
#bb-otp-verify-page p:has(#bb-otp-resend-link) {
  margin-top: -40px !important;
}
/* target to the back to login prompt */
#bb-otp-verify-page p:nth-of-type(3) a {
  font-weight: bold;
  background-color: #fff;
  text-decoration: none;
  padding: 5px;
  line-height: 3.5rem;
}
/* Hides the Privacy and Terms Modal Popup Title as its already repeated */
.login .mfp-content #terms-modal h2, .login .mfp-content #privacy-modal h2 {
  display: none;
}
/* Set a diffrernt Portrait styled Backgorund for Mobile Layouts */
@media (max-width: 782px) {
  body:not(.interim-login) {
    background-image: url(https://my.thesafari.app/ssmedia/2026/01/sfr_commbgmob.webp) !important;
    background-size: auto !important;
    background-position: center center;
    background-repeat: no-repeat;
  }
  .login:not(.interim-login) #nav {
    margin: 40px 0 5px !important;
  }
  .login .privacy-policy-page-link {
    margin: 15px 0 5px !important;
  }
}
@media (min-width: 782px) {
  /* make the page a two-column layout and keep the login on the right */
  /* make the existing overlay/wrapper occupy exactly half the viewport */
  /* ensure the inner login container can center itself inside that half */
  /* Turnstile + Submit button row: create a grid only for these two */
  /* Create the two-column row */
  /* Ensure the two elements sit on the same line */
  body.login {
    display: flex !important;
    flex-direction: row-reverse !important;
    min-height: 100vh;
    margin: 0;
  }
  .uip-login-wrap {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
  #login {
    width: 100% !important;
    margin: 0 auto !important;
  }
  .login:not(.interim-login) #login {
    padding: 10px 25%;
  }
  .login:not(.interim-login) #nav {
    margin-top: 30px;
  }
  .login .privacy-policy-page-link {
    position: absolute;
    bottom: 2vh;
  }
  #loginform div[id^="cf-turnstile-"], #loginform p.submit, #lostpasswordform div[id^="cf-turnstile-"], #lostpasswordform p.submit {
    display: inline-block;
    vertical-align: middle;
    z-index: 9;
    position: relative;
  }
  #loginform div[id^="cf-turnstile-"], #lostpasswordform div[id^="cf-turnstile-"] {
    width: 40%;
    /* left side */
    transform: scale(0.7);
    transform-origin: left center;
    margin-top: -10px;
  }
  #lostpasswordform div[id^="cf-turnstile-"] {
    transform: scale(0.5);
    margin-top: -15px;
  }
  #loginform p.submit, #lostpasswordform p.submit {
    width: 55%;
    /* right side */
    text-align: right;
    margin-top: -15px !important;
  }
  #loginform div[id^="cf-turnstile-"] + p.submit, #lostpasswordform div[id^="cf-turnstile-"] + p.submit {
    white-space: nowrap;
  }
}