/*!
 * Password Management Servlets (PWM)
 * http://www.pwm-project.org
 *
 * Copyright (c) 2006-2009 Novell, Inc.
 * Copyright (c) 2009-2023 The PWM Project
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
.tokenInput {
    height: 20px;
    width: 25%;
    resize: none;
    display: block;
    margin-bottom: 30px;
}

#header {
    width: 100%;
    height: 0;
    margin: 0;
    background: none!important;
}

#header-company-logo {
    /* position: relative; */
    float: left;
    background-image: url('images/logo.png');
    background-size: cover;
    top: 0px;
    left: 0px;
    width: 300px;
    height: 70px;
    z-index: 1;
}

.btn {
    padding: 1rem;
    color: #fff;
    background-color: #f97316;
    border-color: #f97316;
}

.btn:hover {
    background-color: #ea6a0f;
    border-color: #ea6a0f;
}

.header-button:hover {
    background: #fdece6;
    border-radius: 0.3rem;
}


#header-username-caret span.m-icon {
    content: "\f08b";
}


.tile:hover {
    border: 1px solid #ff6a0e94;
}

#centerbody {
    padding: 10px 10px 40px 15px;
    border-radius: 5px;
}

.message-info {
    background-color: #b6ccdb;
}

.message-error {
    background-color: #ffcccc;
}

.message-success {
    background-color: #70c1f9;
}

/* Error page styles */
.error-page-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg);
}

.error-content {
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    padding: 40px 50px;
    max-width: 600px;
    width: 100%;
    text-align: center;
}

.error-logo {
    max-width: 180px;
    height: auto;
    margin: 0 auto 24px;
    display: block;
}

.error-icon-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    background: linear-gradient(135deg, #ff6b4a 0%, #ff8f75 100%);
    border-radius: 50%;
    color: white;
}

.error-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--text);
    margin: 0 0 20px;
}

.error-message-box {
    background: #fff3ef;
    border: 1px solid #ffcccc;
    border-radius: 10px;
    padding: 16px 20px;
    margin: 20px 0;
    color: #d32f2f;
    line-height: 1.6;
    font-size: 14px;
    text-align: left;
    word-break: break-word;
    max-height: 200px;
    overflow-y: auto;
}

.error-buttonbar {
    margin-top: 24px;
}

.error-continue-btn {
    min-width: 160px;
    padding: 12px 28px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.2s;
    background-color: #f97316;
    border-color: #f97316;
}

.error-continue-btn:hover {
    transform: translateY(-1px);
    background-color: #ea6a0f;
    border-color: #ea6a0f;
    box-shadow: 0 6px 12px rgba(249, 115, 22, 0.3);
}

@media (max-width: 768px) {
    .error-content {
        padding: 30px 25px;
    }

    .error-logo {
        max-width: 150px;
        margin-bottom: 20px;
    }

    .error-icon-box {
        width: 56px;
        height: 56px;
        margin-bottom: 16px;
    }

    .error-title {
        font-size: 20px;
        margin-bottom: 16px;
    }

    .error-message-box {
        padding: 14px 16px;
        font-size: 13px;
        margin: 16px 0;
    }

    .error-continue-btn {
        min-width: 140px;
        padding: 10px 24px;
        font-size: 14px;
    }
}

/* Logout/Session Timeout page styles */
.logout-page-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg);
    padding: 0px;
}

.logout-content-card {
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    padding: 40px 50px;
    max-width: 560px;
    width: 100%;
    text-align: center;
}

.logout-logo {
    max-width: 180px;
    height: auto;
    margin: 0 auto 24px;
    display: block;
}

.logout-icon-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    background: linear-gradient(135deg, #4a90ff 0%, #75a9ff 100%);
    border-radius: 50%;
    color: white;
}

.logout-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--text);
    margin: 0 0 20px;
}

.logout-message-box {
    background: #f0f4ff;
    border: 1px solid #c4d7ff;
    border-radius: 10px;
    padding: 16px 20px;
    margin: 20px 0;
    line-height: 1.6;
    font-size: 14px;
}

.logout-description {
    color: #4b5563;
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
}

.logout-buttonbar {
    margin-top: 24px;
}

.logout-continue-btn {
    min-width: 160px;
    padding: 12px 28px;
    font-size: 15px;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.2s;
}

.logout-continue-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 12px rgba(99, 190, 108, 0.3);
}

@media (max-width: 768px) {
    .logout-content-card {
        padding: 30px 25px;
    }

    .logout-logo {
        max-width: 150px;
        margin-bottom: 20px;
    }

    .logout-icon-box {
        width: 56px;
        height: 56px;
        margin-bottom: 16px;
    }

    .logout-title {
        font-size: 20px;
        margin-bottom: 16px;
    }

    .logout-message-box {
        padding: 14px 16px;
        font-size: 13px;
        margin: 16px 0;
    }

    .logout-description {
        font-size: 13px;
    }

    .logout-continue-btn {
        min-width: 140px;
        padding: 10px 24px;
        font-size: 14px;
    }
}

/* Token Choice page styles */
.token-page-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg);
}

.token-content-card {
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    padding: 40px 50px 30px;
    max-width: 600px;
    width: 100%;
    text-align: center;
    position: relative;
}

.tokenchoice-logo-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.tokenchoice-logo {
    max-width: 180px;
    height: auto;
    margin: 0 auto 16px;
    display: block;
}

.tokenchoice-key-box {
    border: 2px solid #E4E7EC;
    padding: 0.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08);
}

.token-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--text);
    margin: 0 0 16px;
}

.token-description {
    color: #4b5563;
    margin: 16px 0 24px;
    font-size: 14px;
    line-height: 1.6;
}

.token-choice-container {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 24px 0;
}

.token-choice-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: #f9fafb;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
}

.token-choice-btn {
    min-width: 120px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 8px;
    flex-shrink: 0;
}

.token-choice-description {
    text-align: left;
    font-size: 14px;
    color: #4b5563;
    line-height: 1.5;
}

.token-masked {
    font-size: 13px;
    color: #6b7280;
    margin-top: 4px;
    font-family: monospace;
}

.token-buttonbar {
    display: flex;
    gap: 12px;
    justify-content: center;
    margin: 24px 0 20px;
    flex-wrap: wrap;
}

.token-buttonbar .btn {
    min-width: 120px;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 8px;
    background-color: #f97316;
    border-color: #f97316;
}

.token-buttonbar .btn:hover {
    background-color: #ea6a0f;
    border-color: #ea6a0f;
    transform: translateY(-1px);
}

.modern-footer {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
    text-align: center;
}

.modern-footer p {
    color: #6b7280;
    font-size: 13px;
    margin: 0;
    line-height: 1.5;
}

@media (max-width: 768px) {
    .token-content-card {
        padding: 30px 25px 25px;
    }

    .tokenchoice-logo {
        max-width: 150px;
        margin-bottom: 16px;
    }

    .token-title {
        font-size: 20px;
        margin-bottom: 12px;
    }

    .token-description {
        font-size: 13px;
        margin: 12px 0 20px;
    }

    .token-choice-item {
        flex-direction: column;
        text-align: center;
        padding: 14px;
        gap: 12px;
    }

    .token-choice-description {
        text-align: center;
        font-size: 13px;
    }

    .token-choice-btn {
        width: 100%;
    }

    .token-buttonbar {
        flex-direction: column;
        gap: 10px;
    }

    .token-buttonbar .btn {
        width: 100%;
    }

    .modern-footer {
        margin-top: 20px;
        padding-top: 16px;
    }

    .modern-footer p {
        font-size: 12px;
    }
}

/* Enter Token/Code page styles */
.entertoken-page-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg);
    padding: 20px;
}

.entertoken-content-card {
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    padding: 40px 50px 30px;
    max-width: 600px;
    width: 100%;
    text-align: center;
}

.entertoken-logo-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

.entertoken-logo {
    max-width: 180px;
    height: auto;
    margin: 0 auto 16px;
    display: block;
}

.entertoken-key-box {
    border: 2px solid #E4E7EC;
    padding: 0.6rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08);
}

.entertoken-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--text);
    margin: 0 0 16px;
}

.entertoken-description {
    color: #4b5563;
    margin: 16px 0 24px;
    font-size: 14px;
    line-height: 1.6;
}

.resend-section {
    background: #f0f9ff;
    border: 1px solid #bfdbfe;
    border-radius: 12px;
    padding: 16px 20px;
    margin: 20px 0;
}

.resend-text {
    color: #1e40af;
    font-size: 14px;
    margin: 0 0 12px;
    line-height: 1.5;
}

.btn-resend {
    min-width: 140px;
    padding: 10px 24px;
    font-size: 14px;
    margin-bottom: 8px;
    background-color: #f97316;
    border-color: #f97316;
}

.btn-resend:hover:not(:disabled) {
    background-color: #ea6a0f;
    border-color: #ea6a0f;
}

.timer-msg {
    color: #6b7280;
    font-size: 13px;
    margin: 8px 0 0;
    font-weight: 500;
}

.entertoken-form {
    margin: 24px 0;
}

.entertoken-form h2 {
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
    margin: 0 0 8px;
    text-align: left;
}

.entertoken-form .inputfield,
.entertoken-form input[type="text"] {
    width: 100%;
    padding: 2px 5px;
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.5px;
    margin-bottom: 20px;
    transition: all 0.2s;
    text-align: center;
}

.entertoken-form .inputfield:focus,
.entertoken-form input[type="text"]:focus {
    outline: none;
    border-color: #f97316;
    box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.1);
}

@media (max-width: 768px) {
    .entertoken-content-card {
        padding: 30px 25px 25px;
    }

    .entertoken-logo {
        max-width: 150px;
        margin-bottom: 16px;
    }

    .entertoken-title {
        font-size: 20px;
        margin-bottom: 12px;
    }

    .entertoken-description {
        font-size: 13px;
        margin: 12px 0 20px;
    }

    .resend-section {
        padding: 14px 16px;
        margin: 16px 0;
    }

    .resend-text {
        font-size: 13px;
        margin-bottom: 10px;
    }

    .btn-resend {
        width: 100%;
        min-width: auto;
    }

    .timer-msg {
        font-size: 12px;
    }

    .entertoken-form .inputfield,
    .entertoken-form input[type="text"] {
        padding: 12px 16px;
        font-size: 16px;
        margin-bottom: 16px;
    }
}

.menubutton {
    white-space: normal;
}

.tab-container>.label:hover {
    color: #000088;
    border-top-color: #000088;
    border-left-color: #000088;
    border-right-color: #000088;
}


:root {
    --bg: #ffffff;
    --card: #FEF3F2;
    --card-hover: #fff3ef;
    --text: #1f2937;
    --muted: #6b7280;
    --brand: #ff6b4a;
    --shadow: 0 10px 20px rgba(0, 0, 0, .06), 0 2px 6px rgba(0, 0, 0, .04);
    --radius: 18px;
}

body {
    background: var(--bg);
    font-family: Inter;
}

.rings {
    position: relative;
    margin: 0 auto 10px;
    max-width: 980px;
    pointer-events: none;
    background: radial-gradient(circle at 50% 120%, rgba(0, 0, 0, .05) 0 1px, transparent 1px) 0 0/48px 48px,
        radial-gradient(circle at 50% 120%, rgba(0, 0, 0, .03) 0 1px, transparent 1px) 0 0/120px 120px;
    opacity: .45;
    border-radius: 24px;
}

#centerbody.tile-centerbody {
    text-align: center;
}

.logo-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 120px;
    height: 56px;
    margin: 6px auto 2px;
    border-radius: 12px;
    font-weight: 800;
    letter-spacing: .5px;
}

.page-title {
    margin: 10px 0 6px;
    font-size: clamp(20px, 2.4vw, 28px);
    font-weight: 700;
    color: var(--text);
    font-size: 24px;
}

.subtitle {
    max-width: 700px;
    color: var(--muted);
    line-height: 1.6;
    text-align: center;
    font-size: 16px;
    /* padding-right: 1rem; */
}

.tile-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    padding: 10px 8px;
    max-width: 1100px;
    margin: 0 auto;
}

@media (max-width: 860px) {
    .tile-grid {
        grid-template-columns: 1fr;
        max-width: 560px;
    }
}

/* Card style applied to existing .tile markup */
.tile {
    background: var(--card);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 0;
    border: 1px solid #ffe2da;
    transition: transform .18s, box-shadow .18s, background .18s;
    text-align: left;
}

.tile:hover {
    transform: translateY(-3px);
    background: var(--card-hover);
    box-shadow: 0 16px 32px rgba(0, 0, 0, .08);
}

.tile-content {
    padding: 22px 20px 18px;
}

.head {
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.icon {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    font-size: 12px;
    font-weight: 700;
    color: #3f3f46;
    background: none;
    box-shadow: none;
    user-select: none;
}

.tile-title {
    font-weight: 700;
    margin-top: 2.2rem;
}

.tile-subtitle {
    color: var(--muted);
    font-size: 12.5px;
    line-height: 1.5;
}

a.tile-link {
    text-decoration: none;
    color: inherit;
    display: flex;
    justify-content: center;
}

.tile {
    width: 80%;
    height: 100%;
}
@media (max-width: 425px) {
  .page-title {
    font-size: 18px;
  }

  .subtitle {
    padding-right: 1rem;
    padding-left: 1rem;
    font-size: 13px;
  }
}

/* Frame: two-column split (left form, right visual) */
.login-page-container{
  min-height:100vh;
  display:grid;
  grid-template-columns: 1.3fr 1fr;
  background:#f7f8fb;
}

/* LEFT: form column */
.login-form-container{
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:40px clamp(20px,4vw,64px);
}

#login-form{
  width:100%;
  max-width: 460px;
}

/* Logo */
#client-logo-container{margin-bottom:12px}
#client-logo-inner{max-height:44px}

/* Titles / description */
#page-content-title{
  font-size: 28px;
  margin: 6px 0 6px;
  color: #111827;
}
.panel-login-display-message{
  display:block;
  color:#6b7280;
  margin-bottom: 18px;
}

/* Status messages (from PWM include) */
.pwm-status-message{
  border:1px solid #e5e7eb;
  background:#fff;
  border-radius:12px;
  padding:12px;
  margin:10px 0 16px;
}

/* Inputs */
.loginFieldLabel{display:none}  /* keep label for a11y but hide visually */
.formFieldWrapper{
  margin-bottom: 10px;
}
.inputfield,
#login-form input[type="text"],
#login-form input[type="password"]{
  width:93%;
  height:46px;
  border:1px solid #e5e7eb;
  border-radius: 12px;
  padding: 0 12px;
  background:#fff;
  font-size:15px;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.inputfield:focus{
  outline:none;
  border-color: #f97316;
  box-shadow: 0 0 0 3px rgba(249,115,22,.15);
}

/* Captcha block spacing (optional; depends on your include) */
.pwm-form-captcha .captcha, .g-recaptcha, #captchaPanel{
  margin: 6px 0 8px;
}

/* Submit button + bar */
.buttonbar{
  margin-top: 14px;
  display:flex;
  align-items:center;
  gap: 12px;
  flex-wrap:wrap;
}
.pwm-btn-submit,
.buttonbar .btn{
  appearance:none;
  background: #f97316;
  color:#fff;
  font-weight:700;
  border-radius:8px;
  cursor:pointer;
  transition: box-shadow .2s ease, transform .03s ease;
}
.pwm-btn-submit:hover{ box-shadow: 0 12px 28px rgba(249,115,22,.35) }
.pwm-btn-submit:active{ transform: translateY(1px) }

/* Bottom options table (Forgotten Password, etc.) */
.noborder{
  width:100%;
  /* margin-top:18px; */
  border-collapse:separate;
  border-spacing:0 10px;
}
.menubutton_key a.menubutton{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:#fff;
  border:1px solid #e5e7eb;
  padding:10px 14px;
  border-radius:12px;
  text-decoration:none;
  color:#111827;
  transition: box-shadow .2s ease, transform .03s ease;
}
.menubutton_key a.menubutton:hover{ box-shadow: 0 10px 28px rgba(0,0,0,.10) }
.menubutton-description{ color:#6b7280; padding-left:10px }

/* RIGHT: visual column */
.photo-section{
  position:relative;
  display:grid;
  place-items:center;
  /* soft concentric gradient like the reference */
  background:#fff;
}

/* The preview card (use any image you like) */
.photo-section img{
    width: 91%;
    height: 100vh;
    margin-left: 4.4rem;
}

/* Optional glossy overlay vibe */
.photo-section img::after{ content:""; }


/* Responsive */
@media (max-width: 1024px){
  /* .login-page-container{ grid-template-columns:1fr }
  .photo-section{ order:-1; min-height:220px }*/
}
@media (max-width: 425px){
  .photo-section{ display: none; }
  .login-page-container{ grid-template-columns:1fr } 

}
/* High-contrast focus for keyboard users */
:focus-visible{
  outline: 3px solid rgba(249,115,22,.5);
  outline-offset: 2px;
}
.login-logo{
    height: 4rem;
}
.forgottenpassword-form-container{
  flex-direction: column;
}
.forgottenpassword-buttonbar{
  gap: 0;
  flex-direction: column;
  margin-top: 0;
}
.forgottenpassword-button{
  width: 100%;
}
.back-button{
  background: none;
  color: gray;
}
.logo-container{
    width: 100%;
    display: flex;
}
.forgottenpassword-logo-box{
  width: 50%;
}
.forgottenpassword-app-desc, .forgottenpassword-form{
  width: 50%;
}
.forgottenpassword-key-box{
  border: 2px solid #E4E7EC;
  padding: 0.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  align-content: center;
  border-radius: 12px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08);
}
  
.forgottenpassword-form .formFieldLabel{
  margin: 0;
  margin-top: 4rem;
}

.forgottenpassword-footer{
  position: fixed;
  bottom: 11px;
  left: 18px;
}

.forgottenpassword-button-cancel{
  background: none!important;
  color: #475467!important;
  display: flex;
  justify-content: center;
  margin-top: 0;
}
.forgottenpassword-button-icon{
  margin-right: 1rem;
}
.forgottenpassword-app-desc{
  font-size: 16px;
}

#header-username-caret , #header-username{
  color: #1f2937;
}

.changepassword-form-container{
  padding: 0px;
}

.changepassword-form-container{
    /* background-color: #eeeeee; */
    padding: 20px 10px 10px 15px;
    border-radius: 5px;
}
.forgottenpassword-tokenchoice-container, .forgottenpassword-entertoken-container, #forgottenpassword-attributes-container{
    padding: 10px 10px 40px 15px;
    border-radius: 5px;
}
.forgottenpassword2-page-container, .forgottenpassword2-page-container{
  min-height: 100vh;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  width: 100%;
}
.forgottenpassword2-form-container{
  display: flex;
  flex-direction: column;
  align-content: center;
  align-items: center;
  justify-content: center;
}

#forgottenpassword-attributes-container{
  width: 50%;
}
#forgottenpassword-input-container{
  width: 50%;
}
@media (max-width: 425px) {
  #forgottenpassword-input-container{
    width: 90%;
  }
}
  #PasswordRequirements {
        display: block;
    }

    #centerbody_otptoken {
      width: 520px !important;
      margin: 80px auto !important;
      padding: 40px 36px !important;
      border-radius: 18px !important;
      background: #ffffff !important;
      border: 1px solid #e5e7eb !important;
      box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08) !important;
      text-align: center !important;
    }

    #centerbody_otptoken p,
    #page_content_title {
      font-size: 18px !important;
      color: #374151 !important;
      margin-bottom: 24px !important;
      font-weight: 500 !important;
    }

    #centerbody_otptoken input[type="text"],
    #centerbody_otptoken input[type="password"] {
      width: 220px !important;
      height: 42px !important;
      padding: 0 14px !important;
      border: 1px solid #d1d5db !important;
      border-radius: 10px !important;
      font-size: 14px !important;
      outline: none !important;
      transition: 0.2s ease !important;
    }

    #centerbody_otptoken input:focus {
      border-color: #ff6a00 !important;
      box-shadow: 0 0 0 4px rgba(255, 106, 0, 0.15) !important;
    }

    #centerbody_otptoken button,
    #centerbody_otptoken input[type="submit"] {
      height: 42px !important;
      padding: 0 18px !important;
      border: none !important;
      border-radius: 10px !important;
      background: #ff6a00 !important;
      color: #ffffff !important;
      font-size: 14px !important;
      font-weight: 600 !important;
      cursor: pointer !important;
      transition: 0.2s ease !important;
    }

    #centerbody_otptoken button:hover,
    #centerbody_otptoken input[type="submit"]:hover {
      background: #e85f00 !important;
      transform: translateY(-1px);
    }

    #centerbody_otptoken a {
      display: inline-flex !important;
      align-items: center !important;
      gap: 6px !important;
      margin-top: 22px !important;
      color: #374151 !important;
      font-size: 13px !important;
      font-weight: 600 !important;
      text-decoration: none !important;
    }

    #centerbody_otptoken a:hover {
      color: #ff6a00 !important;
    }