.error { color:#e3342f; font-size:0.85rem; margin-top:4px; }
  .is-invalid { border:1px solid #e3342f !important; background-color:#fff5f5; }

  .login-switch a {
      text-decoration: underline;
      font-weight: 500;
  }

  /* === STRUCTURE === */
  .client-login .form-group {
    width: 70%;
    margin: 0 auto 22px;
  }

  /* PHONE GROUP */
  .client-login .phone-group {
    position: relative;
    width: 70%;
    margin: 0 auto 22px;
  }

  .client-login .phone-group .iti {
    width: 100% !important;
    display: block;
    position: relative;
  }

  /* flag */
  .client-login .phone-group .iti__flag-container {
    position: absolute !important;
    left: 0 !important;
    top: 32% !important;
    transform: translateY(-50%) !important;
    z-index: 3 !important;
  }

  .client-login .phone-group .iti__selected-flag {
    height: 48px !important;
    padding: 0 10px !important;
    background: transparent !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
  }

  /* === UNIFIED INPUTS (email + phone) === */
  .text_field.login_form,
  .client-login .phone-group .iti input#phone {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 48px !important;
    line-height: 48px !important;

    border: none !important;
    border-bottom: 1px solid #0a3b32 !important;
    border-radius: 0 !important;
    background: transparent !important;

    font: inherit !important;
    color: #0a3b32 !important;
    box-shadow: none !important;
    text-align: left !important;
  }

  /* phone padding (driven by JS via CSS var) */
  .client-login .phone-group .iti input#phone {
    padding-left: var(--iti-pad-left, 75px) !important;
    padding-right: 16px !important;
  }

  /* focus */
  .text_field.login_form:focus,
  .client-login .phone-group .iti input#phone:focus {
    outline: none !important;
    box-shadow: none !important;
    border-bottom-color: #0a3b32 !important;
  }

  /* placeholders */
  .text_field.login_form::placeholder,
  .client-login .phone-group .iti input#phone::placeholder {
    text-align: left !important;
    color: #0a3b32 !important;
    opacity: .7 !important;
  }

  .phone-hint{
    margin-top: 6px;
    font-size: 12px;
    line-height: 16px;
    color: rgba(255, 0, 0, 0.75);
    text-align: left;
  }

  .phone-hint.bad{
    color:#e3342f;
  }

  .iti__country-list { z-index: 9999; }


  /* === SOCIAL LOGIN BUTTONS FIX === */
.social-button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
}

.social-button .btn.btn--round {
  width: 56px;
  height: 56px;
  min-width: 56px;
  min-height: 56px;

  padding: 0 !important;
  border-radius: 50% !important;

  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* icons inside */
.social-button .btn img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}

.social-button .apple_btn img {
  width: 20px;
  height: 20px;
}

  .glass-button-send-code {
    background:#f1a612;
    color:#103E28;

  }
 .glass-button-send-code:hover {
    background:#e09304;
    color:#103E28;    
  }

  .glass-button-explore {text-decoration: underline; font-weight:500;}
  .glass-button-explore:hover {text-decoration: underline;}

  a.login_assist, a.login--header {color: #103E28!important; text-decoration: underline; }
  a.login_assist:hover, a.login--header:hover {color: #103E28!important; text-decoration: underline; }
  .pp-link a {text-decoration: underline; color: #103E28;}

@media (max-width: 768px) {
  /* === FINAL PWA LOGIN VIEWPORT FIX ===
     Keep the login card centered and fitted in Android TWA / iOS PWA / mobile web.
     No page scroll, no card shifting, no phone field width changes. */
  body.signup-page {
    margin: 0 !important;
    min-height: 100vh !important;
    min-height: 100svh !important;
    overflow: hidden !important;
  }

  body.signup-page .signup_area {
    width: 100% !important;
    max-width: 100% !important;
    height: 100vh !important;
    height: 100svh !important;
    min-height: 0 !important;
    padding: clamp(12px, 2.2svh, 22px) 12px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    background-attachment: scroll !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.signup-page .signup_area .container {
    width: 100% !important;
    max-width: 520px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body.signup-page .signup_area .row {
    display: block !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.signup-page .signup_area .col-lg-6,
  body.signup-page .signup_area [class*="offset-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.signup-page .cardify.signup_form {
    width: 100% !important;
    margin: 0 auto !important;
    padding: clamp(18px, 3svh, 30px) clamp(20px, 6vw, 34px) clamp(18px, 3svh, 30px) !important;
    box-sizing: border-box !important;
    border-radius: clamp(26px, 7vw, 42px) !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.signup-page .signup_form .login--header {
    padding-top: 0 !important;
    padding-bottom: clamp(4px, 1svh, 8px) !important;
  }

  body.signup-page .signup_form .login--header h3 {
    margin: 0 !important;
    font-size: clamp(17px, 4.8vw, 26px) !important;
    line-height: 1.15 !important;
  }

  body.signup-page .signup_form .text-center.mb-4 {
    margin-bottom: clamp(12px, 2.4svh, 20px) !important;
  }

  body.signup-page .login_logo {
    width: clamp(58px, 20vw, 86px) !important;
    max-width: 30% !important;
  }

  body.signup-page .login_logo_text {
    font-size: clamp(23px, 7vw, 34px) !important;
    line-height: 1.05 !important;
    margin-top: clamp(8px, 1.4svh, 12px) !important;
  }

  body.signup-page .signup_form .login--form {
    padding: 0 !important;
  }

  body.signup-page .client-login .form-group,
  body.signup-page .client-login .phone-group {
    width: 70% !important;
    margin: 0 auto clamp(10px, 1.8svh, 16px) !important;
  }

  body.signup-page .text_field.login_form,
  body.signup-page .client-login .phone-group .iti input#phone {
    height: clamp(36px, 6.5svh, 48px) !important;
    line-height: clamp(36px, 6.5svh, 48px) !important;
    font-size: clamp(14px, 4vw, 20px) !important;
  }

  body.signup-page .client-login .phone-group .iti__selected-flag {
    height: clamp(36px, 6.5svh, 48px) !important;
  }

  body.signup-page .login-switch {
    margin-bottom: clamp(10px, 1.8svh, 16px) !important;
  }

  body.signup-page .login-switch a,
  body.signup-page .glass-button-explore,
  body.signup-page .signup_form .login--form > p {
    font-size: clamp(15px, 4.2vw, 22px) !important;
    line-height: 1.2 !important;
  }

  body.signup-page .glass-button-send-code {
    min-width: min(260px, 58vw) !important;
    height: clamp(42px, 7svh, 58px) !important;
    min-height: 0 !important;
    padding: 0 clamp(22px, 8vw, 44px) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: clamp(15px, 4.2vw, 22px) !important;
    line-height: 1 !important;
  }

  body.signup-page .divider {
    margin: clamp(10px, 1.9svh, 16px) 0 !important;
    line-height: 1 !important;
  }

  body.signup-page .signup_form .login--form > p.text-center {
    margin-bottom: clamp(10px, 1.8svh, 14px) !important;
  }

  body.signup-page .social-button {
    gap: clamp(18px, 8vw, 32px) !important;
    margin: 0 !important;
  }

  body.signup-page .social-button .btn.btn--round {
    width: clamp(46px, 12.5vw, 62px) !important;
    height: clamp(46px, 12.5vw, 62px) !important;
    min-width: clamp(46px, 12.5vw, 62px) !important;
    min-height: clamp(46px, 12.5vw, 62px) !important;
  }

  body.signup-page .text-center.mt-3 {
    margin-top: clamp(12px, 2.1svh, 18px) !important;
  }

  body.signup-page .login_assist.mt-4 {
    margin-top: clamp(12px, 2.1svh, 18px) !important;
  }

  body.signup-page .pp-link {
    font-size: clamp(12px, 3.2vw, 15px) !important;
    line-height: 1.25 !important;
    margin: 0 auto !important;
    max-width: 88% !important;
  }

  @media (max-width: 390px), (max-height: 640px) {
    body.signup-page .signup_area {
      padding-top: 10px !important;
      padding-bottom: 10px !important;
    }

    body.signup-page .cardify.signup_form {
      padding-top: 16px !important;
      padding-bottom: 16px !important;
    }

    body.signup-page .signup_form .text-center.mb-4 {
      margin-bottom: 10px !important;
    }

    body.signup-page .divider {
      margin-top: 8px !important;
      margin-bottom: 8px !important;
    }
  }
}