/* ============================================================
   Tactical RMM - tema de login (Abatex)
   Paleta alinhada ao GLPI (tema premiumred):
     #e8322a primaria | #c42820 escura | #f05a50 clara
     #fff0ef / #fdd8d6 / #f9a09a  tons de texto
   Injetado via nginx sub_filter, fora de /var/www/rmm/dist,
   portanto sobrevive as atualizacoes do Tactical.
   Gancho: .bg-image = container exclusivo da tela de login.
   ============================================================ */

.bg-image {
  background:
    radial-gradient(1100px 620px at 12% -10%, rgba(240,90,80,.55), transparent 62%),
    radial-gradient(900px 520px at 88% 112%, rgba(232,50,42,.45), transparent 62%),
    radial-gradient(820px 820px at 78% 14%, rgba(232,50,42,.38), transparent 60%),
    linear-gradient(160deg, #8f1d16 0%, #c42820 45%, #6d150f 100%) !important;
  position: relative;
  overflow: hidden;
}

/* campo de estrelas (discreto, o fundo agora e claro) */
.bg-image::before {
  content: "";
  position: absolute;
  inset: -60%;
  pointer-events: none;
  background-image:
    radial-gradient(1.6px 1.6px at 12% 22%, #fff, transparent),
    radial-gradient(1.4px 1.4px at 28% 68%, #fff0ef, transparent),
    radial-gradient(1.8px 1.8px at 44% 14%, #fff, transparent),
    radial-gradient(1.2px 1.2px at 58% 52%, #fdd8d6, transparent),
    radial-gradient(1.7px 1.7px at 71% 31%, #fff, transparent),
    radial-gradient(1.3px 1.3px at 83% 74%, #fff0ef, transparent),
    radial-gradient(1.5px 1.5px at 92% 18%, #fff, transparent),
    radial-gradient(1.2px 1.2px at 8% 84%, #fdd8d6, transparent),
    radial-gradient(1.6px 1.6px at 36% 91%, #fff, transparent),
    radial-gradient(1.3px 1.3px at 65% 88%, #fff0ef, transparent);
  background-size: 620px 620px;
  opacity: .40;
  animation: trmm-drift 260s linear infinite;
}

/* halo inferior luminoso */
.bg-image::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -58vw;
  width: 116vw;
  height: 116vw;
  transform: translateX(-50%);
  pointer-events: none;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 0%, rgba(255,255,255,.20), rgba(240,90,80,.10) 40%, transparent 66%);
  filter: blur(2px);
}

@keyframes trmm-drift {
  from { transform: translate3d(0,0,0); }
  to   { transform: translate3d(-620px,-620px,0); }
}

/* cartao de login - claro, sobre o fundo vermelho */
.bg-image .q-card {
  position: relative;
  z-index: 1;
  background: rgba(255,255,255,.86) !important;
  backdrop-filter: blur(16px) saturate(120%);
  -webkit-backdrop-filter: blur(16px) saturate(120%);
  border: 1px solid rgba(255,255,255,.55) !important;
  border-radius: 18px !important;
  box-shadow:
    0 30px 74px rgba(70,10,7,.42),
    0 2px 6px rgba(0,0,0,.08);
  color: #262b33 !important;
}

/* textos dentro do cartao */
.bg-image .q-card,
.bg-image .q-card .text-h4,
.bg-image .q-card .text-h6,
.bg-image .q-card .q-item__label { color: #262b33 !important; }
.bg-image .q-card a { color: #c42820 !important; }
.bg-image .q-card a:hover { color: #e8322a !important; }

/* campos de formulario em tema claro */
.bg-image .q-field__native,
.bg-image .q-field__input,
.bg-image .q-field__prefix,
.bg-image .q-field__suffix { color: #262b33 !important; }
.bg-image .q-field__label { color: #6b7280 !important; opacity: 1; }
.bg-image .q-icon { color: #6b7280 !important; }
.bg-image .q-field__control::before { border-color: rgba(0,0,0,.22) !important; }
.bg-image .q-field__control:hover::before { border-color: rgba(0,0,0,.38) !important; }
.bg-image .q-field__control::after { background: #e8322a !important; }
.bg-image .q-field--focused .q-field__label { color: #c42820 !important; }
.bg-image .q-field--focused .q-icon { color: #c42820 !important; }
.bg-image input:-webkit-autofill {
  -webkit-text-fill-color: #262b33 !important;
  -webkit-box-shadow: 0 0 0 1000px rgba(255,255,255,.92) inset !important;
  caret-color: #262b33;
}

/* botao principal - primaria exata do GLPI */
.bg-image .q-btn.bg-primary,
.bg-image .q-btn--standard.text-primary,
.bg-image .q-btn[type="submit"] {
  background: linear-gradient(135deg, #e8322a 0%, #f05a50 100%) !important;
  color: #ffffff !important;
  border-radius: 11px !important;
  box-shadow: 0 8px 20px rgba(196,40,32,.32) !important;
  letter-spacing: .3px;
}
.bg-image .q-btn[type="submit"]:hover { filter: brightness(1.07); }

@media (prefers-reduced-motion: reduce) {
  .bg-image::before { animation: none; }
}