/* Patch 503: HNT app palette for Socialite auth pages (login/register).
   Matches the Android/Web palette: bg #070605, surface #12100D, surface2 #1C1712,
   text #F2ECE1, muted #A79A8A, gold #E0B45A, red #B83B32. */

.hh-auth-hnt-palette {
  --hnt-bg: #070605;
  --hnt-surface: #12100D;
  --hnt-surface-2: #1C1712;
  --hnt-surface-3: #17110A;
  --hnt-border: rgba(224, 180, 90, .24);
  --hnt-border-soft: rgba(242, 236, 225, .09);
  --hnt-text: #F2ECE1;
  --hnt-muted: #A79A8A;
  --hnt-gold: #E0B45A;
  --hnt-gold-2: #E7B85F;
  --hnt-red: #B83B32;
  --hnt-red-dark: #7A1D20;
  --hnt-success: #4FA66A;
  background: var(--hnt-bg) !important;
  color: var(--hnt-text) !important;
  color-scheme: dark;
}

.hh-auth-hnt-palette .sm\:flex {
  min-height: 100vh;
  background:
    radial-gradient(circle at 22% 8%, rgba(184, 59, 50, .12), transparent 28rem),
    radial-gradient(circle at 3% 100%, rgba(224, 180, 90, .08), transparent 25rem),
    var(--hnt-bg) !important;
}

.hh-auth-hnt-palette .relative.lg\:w-\[580px\],
.hh-auth-hnt-palette .relative.md\:w-96,
.hh-auth-hnt-palette .hh-auth-panel {
  background:
    linear-gradient(180deg, rgba(18, 16, 13, .98), rgba(12, 10, 8, .98)) !important;
  border-right: 1px solid var(--hnt-border-soft) !important;
  box-shadow: 24px 0 70px rgba(0, 0, 0, .48) !important;
}

.hh-auth-hnt-palette h1,
.hh-auth-hnt-palette h2,
.hh-auth-hnt-palette h3,
.hh-auth-hnt-palette h4,
.hh-auth-hnt-palette label,
.hh-auth-hnt-palette .text-black,
.hh-auth-hnt-palette .dark\:text-white {
  color: var(--hnt-text) !important;
}

.hh-auth-hnt-palette p,
.hh-auth-hnt-palette span,
.hh-auth-hnt-palette .text-gray-700,
.hh-auth-hnt-palette .text-gray-600,
.hh-auth-hnt-palette .text-gray-500,
.hh-auth-hnt-palette .text-slate-500,
.hh-auth-hnt-palette .text-slate-600,
.hh-auth-hnt-palette .text-slate-700,
.hh-auth-hnt-palette .dark\:text-gray-300 {
  color: var(--hnt-muted) !important;
}

.hh-auth-hnt-palette a,
.hh-auth-hnt-palette .text-blue-700,
.hh-auth-hnt-palette .text-blue-600,
.hh-auth-hnt-palette .text-primary {
  color: var(--hnt-gold) !important;
}

.hh-auth-hnt-palette a:hover {
  color: var(--hnt-gold-2) !important;
}

.hh-auth-hnt-palette nav[aria-label] {
  background: rgba(28, 23, 18, .94) !important;
  border-color: var(--hnt-border) !important;
  box-shadow: 0 14px 30px rgba(0, 0, 0, .34) !important;
}

.hh-auth-hnt-palette nav[aria-label] a {
  color: var(--hnt-muted) !important;
}

.hh-auth-hnt-palette nav[aria-label] a[aria-current="true"],
.hh-auth-hnt-palette nav[aria-label] a.bg-primary {
  background: rgba(224, 180, 90, .18) !important;
  color: var(--hnt-gold) !important;
  box-shadow: inset 0 0 0 1px rgba(224, 180, 90, .24) !important;
}

.hh-auth-hnt-palette input[type="text"],
.hh-auth-hnt-palette input[type="email"],
.hh-auth-hnt-palette input[type="password"],
.hh-auth-hnt-palette input[type="search"],
.hh-auth-hnt-palette textarea,
.hh-auth-hnt-palette select {
  background: var(--hnt-surface-2) !important;
  border: 1px solid rgba(224, 180, 90, .24) !important;
  color: var(--hnt-text) !important;
  box-shadow: none !important;
  caret-color: var(--hnt-gold) !important;
}

.hh-auth-hnt-palette input::placeholder,
.hh-auth-hnt-palette textarea::placeholder {
  color: rgba(167, 154, 138, .82) !important;
}

.hh-auth-hnt-palette input[type="text"]:focus,
.hh-auth-hnt-palette input[type="email"]:focus,
.hh-auth-hnt-palette input[type="password"]:focus,
.hh-auth-hnt-palette input[type="search"]:focus,
.hh-auth-hnt-palette textarea:focus,
.hh-auth-hnt-palette select:focus {
  border-color: rgba(224, 180, 90, .62) !important;
  box-shadow: 0 0 0 3px rgba(224, 180, 90, .12) !important;
  outline: none !important;
}

.hh-auth-hnt-palette input[type="checkbox"] {
  accent-color: var(--hnt-gold) !important;
}

.hh-auth-hnt-palette .button,
.hh-auth-hnt-palette button[type="submit"],
.hh-auth-hnt-palette .bg-primary {
  background: linear-gradient(135deg, var(--hnt-red), #8F2B25) !important;
  border-color: rgba(224, 180, 90, .22) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgba(184, 59, 50, .25) !important;
}

.hh-auth-hnt-palette .button:hover,
.hh-auth-hnt-palette button[type="submit"]:hover {
  filter: brightness(1.08);
}

.hh-auth-hnt-palette hr {
  border-color: var(--hnt-border-soft) !important;
}

.hh-auth-hnt-palette .hh-social-login-grid .button,
.hh-auth-hnt-palette .hh-social-login-grid a.button {
  background: var(--hnt-surface-2) !important;
  border: 1px solid rgba(224, 180, 90, .24) !important;
  color: var(--hnt-text) !important;
  box-shadow: 0 10px 22px rgba(0, 0, 0, .22) !important;
}

.hh-auth-hnt-palette .hh-social-login-grid .button:hover,
.hh-auth-hnt-palette .hh-social-login-grid a.button:hover {
  background: rgba(224, 180, 90, .12) !important;
  color: var(--hnt-gold) !important;
}

.hh-auth-hnt-palette .rounded-lg.border,
.hh-auth-hnt-palette .rounded-xl.border,
.hh-auth-hnt-palette .border {
  border-color: var(--hnt-border-soft) !important;
}

.hh-auth-hnt-palette .bg-emerald-50 {
  background: rgba(79, 166, 106, .13) !important;
  border-color: rgba(79, 166, 106, .28) !important;
  color: #BCE8C8 !important;
}

.hh-auth-hnt-palette .text-emerald-800,
.hh-auth-hnt-palette .text-emerald-700 {
  color: #BCE8C8 !important;
}

.hh-auth-hnt-palette .bg-red-50 {
  background: rgba(184, 59, 50, .14) !important;
  border-color: rgba(184, 59, 50, .34) !important;
  color: #F2C0BA !important;
}

.hh-auth-hnt-palette .text-red-700,
.hh-auth-hnt-palette .text-red-600 {
  color: #F2C0BA !important;
}

.hh-auth-hnt-palette .flex-1.relative.bg-primary {
  background: var(--hnt-bg) !important;
}

.hh-auth-hnt-palette .flex-1.relative.bg-primary::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 45%, rgba(224, 180, 90, .08), transparent 22rem),
    linear-gradient(90deg, rgba(7, 6, 5, .24), transparent 24%),
    linear-gradient(180deg, rgba(7, 6, 5, .08), rgba(7, 6, 5, .50));
}

.hh-auth-hnt-palette .flex-1.relative.bg-primary > * {
  position: relative;
}

.hh-auth-hnt-palette .flex-1.relative.bg-primary img.uk-animation-kenburns {
  filter: saturate(1.02) contrast(1.04) brightness(.82);
}

.hh-auth-hnt-palette .absolute.bottom-0.w-full.z-10 {
  z-index: 2 !important;
}

.hh-auth-hnt-palette .w-full.h-96.bg-gradient-to-t.from-black {
  background: linear-gradient(to top, rgba(7,6,5,.96), transparent) !important;
}

.hh-auth-hnt-palette .absolute.bottom-0 h4,
.hh-auth-hnt-palette .absolute.bottom-0 p {
  text-shadow: 0 4px 22px rgba(0, 0, 0, .72);
}

.hh-auth-hnt-palette .shadow-xl,
.hh-auth-hnt-palette .shadow-sm {
  box-shadow: 0 18px 45px rgba(0, 0, 0, .30) !important;
}

@media (max-width: 767px) {
  .hh-auth-hnt-palette .relative.lg\:w-\[580px\],
  .hh-auth-hnt-palette .relative.md\:w-96 {
    border-right: 0 !important;
    background:
      radial-gradient(circle at top right, rgba(184, 59, 50, .14), transparent 23rem),
      var(--hnt-bg) !important;
  }
}
