/* ===== AI4SEC brand theme (injected via Caddy) ===== */
:root, .dark {
  --primary: #F0A500 !important;
  --primary-foreground: #0C0D10 !important;
  --ring: #F0A500 !important;
  --sidebar-primary: #F0A500 !important;
  --sidebar-ring: #F0A500 !important;
}

/* hide the decorative default username field */
#username, label[for="username"] { display: none !important; }

/* primary / submit buttons: clean bright orange gradient + glow */
button[type="submit"] {
  background: linear-gradient(135deg,#FFC94F 0%,#F3A80B 100%) !important;
  color: #0C0D10 !important;
  border: 0 !important;
  font-weight: 600 !important;
  box-shadow: 0 8px 22px -8px rgba(240,165,0,.55) !important;
  transition: filter .15s ease, box-shadow .15s ease, transform .05s ease !important;
}
button[type="submit"]:hover { filter: brightness(1.06) !important; box-shadow: 0 10px 28px -8px rgba(240,165,0,.72) !important; }
button[type="submit"]:active { transform: translateY(1px) !important; }

/* ===== auth pages only (html.ai4sec-auth) ===== */
.ai4sec-auth body {
  background:
    radial-gradient(1000px 520px at 50% -12%, rgba(240,165,0,.14), transparent 62%),
    radial-gradient(640px 420px at 88% 112%, rgba(240,165,0,.08), transparent 60%),
    #0A0B0D !important;
}

/* LEFT hero panel: was flooded orange (bg-primary) -> make it dark with glow */
.ai4sec-auth .bg-primary.flex-col {
  background: radial-gradient(130% 120% at 50% 38%, #17130A 0%, #0C0D10 68%) !important;
  color: #ffffff !important;
}
/* radar rings on the hero panel -> subtle orange */
.ai4sec-auth .bg-primary.flex-col .rounded-full { border-color: rgba(240,165,0,.22) !important; }
/* colored AI4SEC wordmark with soft glow (drop their brightness-0 invert) */
.ai4sec-auth img[src="/logo.png"], .ai4sec-auth img[alt="ARTEX"] {
  filter: drop-shadow(0 6px 20px rgba(240,165,0,.35)) !important;
}

/* glassy dark auth card with orange hairline + glow */
.ai4sec-auth form {
  border: 1px solid rgba(240,165,0,.30) !important;
  border-top: 2px solid #F0A500 !important;
  border-radius: 16px !important;
  background: rgba(18,20,24,.72) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  box-shadow: 0 28px 70px -24px rgba(0,0,0,.75), 0 0 48px -18px rgba(240,165,0,.38), inset 0 1px 0 rgba(255,255,255,.04) !important;
  padding: 30px !important;
}
.ai4sec-auth input { background: rgba(12,13,16,.6) !important; border: 1px solid rgba(255,255,255,.09) !important; }
.ai4sec-auth input:focus { border-color: #F0A500 !important; box-shadow: 0 0 0 3px rgba(240,165,0,.22) !important; }
