:root, .af-custom-form-container .af-form {
    --primary-color: #277dce;
  }

          :root, .af-custom-form-container .af-form {
    --button-font-color: #ffffff;
  }
  
          :root {
    --secondary-button-border-color: #c9cace;
    --social-button-border-color: #c9cace;
    --radio-button-border-color: #c9cace;
  }

          :root {
    --secondary-button-text-color: #1e212a;
  }

          :root {
    --link-color: #277dce;
  }

          :root {
    --title-font-color: #1e212a;
  }

          :root {
    --font-default-color: #1e212a;
  }

          :root {
    --widget-background-color: #ffffff;
  }
          :root {
    --box-border-color: #c9cace;
  }   
          :root {
    --font-light-color: #65676e;
  }  
          :root {
    --input-text-color: #000000;
  }
          :root {
    --input-border-color: #c9cace;
    --border-default-color: #c9cace;
  }
          :root {
    --input-background-color: #ffffff;
  } 
          :root {
    --icon-default-color: #277dce;
  }
          :root {
    --error-color: #d03c38;
    --error-text-color: #ffffff;
  }        
          :root {
    --success-color: #13a688;
  }  
          :root {
    --base-focus-color: #277dce;
    --transparency-focus-color: rgba(39,125,206, 0.15);
  }
          :root {
    --base-hover-color: #000000;
    --transparency-hover-color: rgba(0,0,0, var(--hover-transparency-value));
  }    
      @media (prefers-color-scheme: dark) {
        :root {
          --ulp-captcha-widget-theme: dark;
        }
      }
      @media (not (prefers-color-scheme: dark)) {
        :root {
          --ulp-captcha-widget-theme: light;
        }
      }
          html, :root, .af-custom-form-container .af-form {
    font-size: 16px;
    --default-font-size: 16px;
  } 
          body {
    --title-font-size: 1.5rem;
    --title-font-weight: var(--font-default-weight);
  }
          .c525e2725 {
    font-size: 0.875rem;
    font-weight: var(--font-default-weight);
  }  
          .c97ec8646 {
    font-size: 0.875rem;
    font-weight: var(--font-default-weight);
  }
  .ulp-passkey-benefit-heading {
    font-size: 1.025rem;
  }
          .c9c7c0d5e, .cb1b272ed {
    font-size: 1rem;
    font-weight: var(--font-default-weight);
  }
          body {
    --ulp-label-font-size: 1rem;
    --ulp-label-font-weight: var(--font-default-weight);
  }   
          .c81e39b93, .c9a9376e4, [id^='ulp-container-'] a {
    font-size: 0.875rem;
    font-weight: var(--font-bold-weight) !important;
  }
          :root {
    --button-border-width: 1px;
    --social-button-border-width: 1px;
    --radio-border-width: 1px;
  }  
          body {
    --button-border-radius: 3px;
    --radio-border-radius: 3px;
  }   
          :root {
    --input-border-width: 1px;
  } 
          body {
    --input-border-radius: 3px;
  }
  .af-custom-form-container .af-form {
    --border-radius: 3px;
  }   
          :root {
    --border-radius-outer: 5px;
  }  
          :root {
    --box-border-width: 0px;
  }
          body {
    --shadow-component-outer: none;
  }     
    body {
      --logo-alignment: 0 auto;
    }
    .c5fc77319 {
      content: url('logo-dealercenter2.png');
    }

          body {
    --logo-height: 52px;
  }
  .c5fc77319 {
    height: var(--logo-height);
  } 
    body {
      --header-alignment: center;
    }  
          .c77b3871e {
    --page-background-alignment: center;
  } 
          body {
    --page-background-color: #fff;
  }
    .no-js {
      clip: rect(0 0 0 0);
      clip-path: inset(50%);
      height: 1px;
      overflow: hidden;
      position: absolute;
      white-space: nowrap;
      width: 1px;
    }
            html, body {
                height: 100%;
            }
            #page-container {
                display: flex;
                height: 100vh;
                width: 100vw;
                flex-wrap: nowrap;
            }
            #now-login-banner img {
                width: auto;
                height: 100%;
                visibility: visible;
                display: block;
                background-color: transparent;
                position: fixed;
            }
            #auth0-login-widget {
                background: #fff;
                position: absolute;
                right: 0;
                float: right;
                height: 100%;
                width: 540px;
                margin: 0;
                padding: 0;
                z-index: 1;
                overflow-y: auto;
                overflow-x: hidden;
                text-align: center;
                display: table;
                text-align: left;
                padding: 0 70px;
            }
            #child-wrap {
                display: table-cell;
                vertical-align: middle;
            }
            #forgot-container {
                display: flex;
                justify-content: center;
                width: 100%;
                align-items: center;
                color: #529BCB;
                font-weight: 700;
                text-decoration: underline;

                #forgot-container-separator {
                    font-size: 16px;
                    padding: 0px 10px;
                }
            }
            .qr-loading {
                color: #666;
                font-style: italic;
            }
            .login-options {
              width: 100%;
              max-width: 400px;
            }
            .login-option {
              margin-bottom: 2rem;
              text-align: center;
            }
            .login-option-title {
                font-size: 1.125rem;
                font-weight: 600;
                color: #292929;
                letter-spacing: .5px;
                margin-bottom: .5rem;
            }
            .login-separator {
              margin: 0 var(--spacing-5);
              text-align: center;
              margin-bottom: 2rem;
              position: relative;
            }
            .login-separator::before {
              content: '';
              position: absolute;
              top: 50%;
              left: 0;
              right: 0;
              height: 1px;
              background-color: #e1e1e1;
            }
            .login-separator-text {
              background-color: #ffffff;
              padding: 0 1rem;
              color: #8c8c8c;
              font-weight: 500;
              font-size: 0.875rem;
              position: relative;
            }
            .qr-code-container {
              display: flex;
              flex-direction: column;
              align-items: center;
            }
            .qr-code {
              margin-bottom: 1rem;
              padding: 1rem;
              background-color: #ffffff;
              border: 2px solid #e1e1e1;
              border-radius: 12px;
              position: relative;
            }
            .qr-image {
              width: 150px;
              height: 150px;
              display: block;
            }
            .qr-instructions {
              margin-bottom: 0.5rem;
              color: #4f4f4f;
              background-color: #e1e1e1;
              font-size: 0.875rem;
              line-height: 1.4;
              text-align: center;
              border-radius: 6px;
              padding: .5rem;
            }
            .qr-refresh {
              color: #8c8c8c;
              font-size: 0.75rem;
              margin: 0;
            }
            .qr-timer {
              font-weight: 600;
              color: #8c8c8c;
            }
            .qr-error {
              color: #dc3545;
              background-color: #f8d7da;
              border: 1px solid #f5c6cb;
              border-radius: 6px;
              padding: 1rem;
              text-align: center;
              font-size: 0.875rem;
              line-height: 1.4;
              width: 275px;
            }
            .qr-error-title {
              font-weight: 600;
              margin-bottom: 0.5rem;
            }
            /* New overlay styles */
            .qr-overlay {
              position: absolute;
              top: 0;
              left: 0;
              right: 0;
              bottom: 0;
              background-color: rgba(0, 0, 0, 0.7);
              border-radius: 12px;
              display: flex;
              flex-direction: column;
              align-items: center;
              justify-content: center;
              z-index: 10;
              padding: 1rem;
            }
            .qr-overlay-content {
              color: white;
              border-radius: 8px;
              text-align: center;
              box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
              max-width: 250px;
            }
            .qr-overlay-title {
              font-size: 1rem;
              font-weight: 600;
              margin-bottom: 0.75rem;
              line-height: 1.3;
            }
            .qr-overlay-message {
              font-size: 0.875rem;
              margin-bottom: 1rem;
              line-height: 1.4;
            }
            .qr-overlay-button {
              background-color: #277dce;
              color: white;
              border: none;
              padding: 0.75rem 1.25rem;
              border-radius: 3px;
              cursor: pointer;
              font-size: 0.875rem;
              font-weight: 500;
              transition: background-color 0.2s ease;
            }
            .qr-overlay-button:hover {
              background-color: #4588a8;
            }
            .custom-login-text {
                font-size: 22px;
                margin-bottom: -10px;
                text-align: center;
            }

            /* Safari specific fixes */
            @supports (-webkit-touch-callout: none) {
                body {
                    min-height: -webkit-fill-available;
                }
                #page-container {
                    min-height: -webkit-fill-available;
                }
                #auth0-login-widget {
                    -webkit-overflow-scrolling: touch;
                }
            }

            /* Responsive adjustments for narrower Safari viewports */
            @media screen and (max-width: 768px) {
                #page-container {
                    flex-direction: column-reverse;
                    height: auto;
                    min-height: 100vh;
                }
                #now-login-banner {
                    position: relative;
                    width: 100%;
                    max-width: none;
                    background-position: center;
                    background-size: cover;
                    min-height: 280px;
                }
                #now-login-banner img {
                    position: static;
                    width: 100%;
                    height: auto;
                }
                #auth0-login-widget {
                    position: relative;
                    width: 100%;
                    max-width: 100%;
                    height: auto;
                    padding: 40px 32px;
                    display: block;
                    text-align: left;
                }
                #child-wrap {
                    display: block;
                }
                @supports (-webkit-touch-callout: none) {
                    #page-container {
                        min-height: -webkit-fill-available;
                    }
                }
            }

            @media screen and (max-width: 640px) {
                #auth0-login-widget {
                    padding: 32px 20px;
                }
                .qr-code {
                    width: 100%;
                    max-width: 260px;
                }
                .qr-error {
                    width: 100%;
                    max-width: 260px;
                }
            }
            ._widget header h1,
            ._widget header p {
                display: none;
            }

            ._widget ._prompt-box-outer {
                width: 100% !important;
            }

            @media screen and (max-width: 768px) {
                ._widget ._prompt-box-outer {
                    width: 100% !important;
                }
            }