.auth-shell {
      background:
        linear-gradient(120deg, rgba(11,31,51,.94), rgba(14,59,46,.88), rgba(122,30,44,.65)),
        url('../images/hero/property_hero.jpg') center/cover;
    }

    .auth-card {
      background: rgba(255,252,245,.94);
      backdrop-filter: blur(18px);
      border: 1px solid rgba(198,161,91,.45);
      box-shadow: 0 30px 90px rgba(0,0,0,.30);
    }

    /* Pastel Green for Sign In Tab when active */
    #loginTab.active {
      background: linear-gradient(135deg, #B5D5C5, #9CBCA8);
      color: #0B1F33;
      box-shadow: 0 12px 30px rgba(156, 188, 168, 0.35);
    }

    /* Pastel Red for Create Account Tab when active */
    #registerTab.active {
      background: linear-gradient(135deg, #E6B8B8, #D19A9A);
      color: #4A151E;
      box-shadow: 0 12px 30px rgba(209, 154, 154, 0.35);
    }

    .auth-input {
      border: 1px solid rgba(198,161,91,.40);
      background: rgba(255,255,255,.88);
    }

    .auth-input:focus {
      outline: none;
      border-color: #A87932;
      box-shadow: 0 0 0 4px rgba(198,161,91,.18);
    }

    /* Form Submit Buttons */
    .btn-pastel-green {
      background: linear-gradient(135deg, #B5D5C5, #9CBCA8);
      color: #0B1F33;
      box-shadow: 0 14px 30px rgba(156, 188, 168, 0.35);
    }
    .btn-pastel-green:hover { filter: brightness(1.04); transform: translateY(-1px); }

    .btn-pastel-red {
      background: linear-gradient(135deg, #E6B8B8, #D19A9A);
      color: #4A151E;
      box-shadow: 0 14px 30px rgba(209, 154, 154, 0.35);
    }
    .btn-pastel-red:hover { filter: brightness(1.04); transform: translateY(-1px); }
    
    button:disabled {
      opacity: 0.7;
      cursor: not-allowed;
    }

    /* Forgot Password Specific Styles */
.reset-card {
  background: rgba(255,252,245,.94);
  backdrop-filter: blur(18px);
  border: 1px solid rgba(198,161,91,.45);
  box-shadow: 0 30px 90px rgba(0,0,0,.30);
}
.reset-step {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}
.reset-input {
  border: 1px solid rgba(198,161,91,.40);
  background: rgba(255,255,255,.88);
  outline: none;
  transition: .2s ease;
}
.reset-input:focus {
  border-color: #A87932;
  box-shadow: 0 0 0 4px rgba(198,161,91,.18);
}
.deep-green-button {
  background: linear-gradient(135deg, #0E3B2E, #145A44);
  color: #FFFCF5;
  box-shadow: 0 14px 32px rgba(14,59,46,.22);
  transition: .2s ease;
}
.deep-green-button:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}
.security-line {
  border-left: 3px solid #C6A15B;
}
/* London correction: Create Account active tab must be pastel green, not warning red */
#registerTab.auth-tab.active {
  background: linear-gradient(135deg, #dff4df 0%, #bfe8bf 100%) !important;
  color: #0B1F33 !important;
  box-shadow: 0 10px 24px rgba(27, 94, 32, 0.16) !important;
}

#registerForm .btn-pastel-green {
  background: linear-gradient(135deg, #dff4df 0%, #bfe8bf 100%) !important;
  color: #0B1F33 !important;
  box-shadow: 0 10px 24px rgba(27, 94, 32, 0.16) !important;
}

/* London login background */
.auth-shell {
  background:
    linear-gradient(135deg, rgba(11, 31, 51, 0.88), rgba(11, 31, 51, 0.72)),
    url("/images/hero/london_login_background.jpg") center center / cover no-repeat !important;
}

/* Login feature cards: justified descriptions with soft-hyphen word breaks */
.login-feature-copy {
    text-align: justify;
    text-align-last: left;
    hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphenate-character: "-";
    -webkit-hyphenate-character: "-";
    word-break: normal;
    overflow-wrap: normal;
}

/* Forgot-password pages: keep translated desktop header items on one line */
.forgot-header-menu,
.forgot-header-actions {
    flex-wrap: nowrap;
    white-space: nowrap;
}

.forgot-header-menu a,
.forgot-header-actions a {
    white-space: nowrap;
    flex-shrink: 0;
}

@media (min-width: 1024px) and (max-width: 1280px) {
    .forgot-header-menu {
        gap: 1.25rem;
        font-size: 0.82rem;
    }

    .forgot-header-actions {
        gap: 0.65rem;
    }

    .forgot-header-actions a {
        padding-left: 1rem;
        padding-right: 1rem;
        font-size: 0.82rem;
    }
}

@media (min-width: 1281px) {
    .forgot-header-menu a,
    .forgot-header-actions a {
        white-space: nowrap;
    }
}