/* ── B2S Growth - Chat — White-label theme ── */

/* Brand colors roxos */
:root {
  --color-woot-25:  #FAF5FF;
  --color-woot-50:  #F3E8FF;
  --color-woot-75:  #E9D5FF;
  --color-woot-100: #DDB6FF;
  --color-woot-200: #C084FC;
  --color-woot-300: #A855F7;
  --color-woot-400: #7C22C7;
  --color-woot-500: #6500B4;
  --color-woot-600: #5800A0;
  --color-woot-700: #4A008A;
  --color-woot-800: #3C0070;
  --color-woot-900: #2D0058;
}

/* ── FUNDO DA PÁGINA ── */
/* Pseudo-element fixo atrás de tudo — não é sobrescrito pelo Tailwind */
body::before {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -1 !important;
  background-image: url('/brand-assets/bg.png') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* Transparência no body para o ::before aparecer */
body {
  background: transparent !important;
}

/* A main do login tem fundo — zerar para a imagem aparecer */
main.min-h-screen,
.min-h-screen {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* Tailwind usa bg-n-brand/5 como custom property — zeramos também */
main[class*="bg-n-brand"],
main[class*="bg-n-background"] {
  background: transparent !important;
}

/* ── VIDRO SUAVE (igual GHL: 3% opacidade, blur 2px) ── */
main section[class*="bg-white"],
main section[class*="shadow"],
main section[class*="rounded"] {
  background: rgba(255, 255, 255, 0.03) !important;
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4) !important;
}

/* ── TEXTOS BRANCOS ── */
main h2,
main h4,
main section[class*="bg-white"] *,
main section[class*="shadow"] *,
main section[class*="rounded"] * {
  color: #ffffff !important;
}

main a {
  color: #ffffff !important;
}

/* ── INPUTS — fundo claro como no GHL ── */
main input[type="text"],
main input[type="email"],
main input[type="password"] {
  color: #1a1a1a !important;
  background-color: rgba(255, 255, 255, 0.90) !important;
  border-color: rgba(255, 255, 255, 0.30) !important;
}

main input::placeholder {
  color: #888888 !important;
}

/* ── BOTÃO ── */
main button[type="submit"] {
  background-color: #6500B4 !important;
  border-color: #6500B4 !important;
  color: #ffffff !important;
}

main button[type="submit"]:hover {
  background-color: #7C22C7 !important;
}