#bb-overlay {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: rgba(10, 5, 18, 0.82) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 999999 !important;
  padding: 0 !important;
  margin: 0 !important;
  backdrop-filter: blur(3px);
  box-sizing: border-box !important;
}

/* Wrapper forces inline-block so theme can't stretch it full width */
#bb-modal-wrap {
  display: inline-block !important;
  width: auto !important;
  max-width: 90vw !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  clear: none !important;
}

#bb-modal {
  background: #2a1f35 !important;
  border-radius: 16px !important;
  padding: 2rem 2rem !important;
  width: 560px !important;
  max-width: 90vw !important;
  min-width: 0 !important;
  text-align: center !important;
  border: 0.5px solid rgba(255,255,255,0.1) !important;
  font-family: Georgia, 'Times New Roman', serif !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  float: none !important;
}

/* Reset any theme interference on children */
#bb-modal * {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

#bb-modal .bb-eyebrow {
  display: block !important;
  font-family: Arial, sans-serif !important;
  font-size: 10px !important;
  letter-spacing: 0.15em !important;
  color: #b8a8c8 !important;
  text-transform: uppercase !important;
  margin: 0 0 0.75rem !important;
  width: auto !important;
}

#bb-modal .bb-title {
  display: block !important;
  font-size: 20px !important;
  font-weight: normal !important;
  color: #f0eaf8 !important;
  line-height: 1.35 !important;
  margin: 0 0 0.6rem !important;
  width: auto !important;
  font-family: Georgia, 'Times New Roman', serif !important;
}

#bb-modal .bb-title-sm {
  font-size: 18px !important;
}

#bb-modal .bb-subtitle {
  display: block !important;
  font-size: 13px !important;
  color: #9e8fad !important;
  line-height: 1.55 !important;
  margin: 0 0 1.25rem !important;
  width: auto !important;
  font-family: Georgia, 'Times New Roman', serif !important;
}

#bb-modal .bb-italic {
  font-style: italic !important;
}

#bb-email-input {
  display: block !important;
  width: 100% !important;
  padding: 11px 14px !important;
  border-radius: 8px !important;
  border: none !important;
  font-size: 14px !important;
  font-family: Arial, sans-serif !important;
  background: #fff !important;
  color: #1a1020 !important;
  margin-bottom: 10px !important;
  outline: none !important;
}
#bb-email-input:focus {
  box-shadow: 0 0 0 2px #9f7fcc !important;
}
#bb-email-input.bb-input-error {
  box-shadow: 0 0 0 2px #c04040 !important;
}

#bb-modal .bb-error {
  display: block !important;
  font-size: 11px !important;
  color: #e08080 !important;
  font-family: Arial, sans-serif !important;
  margin: 0 0 8px !important;
}

#bb-send-btn,
#bb-verify-btn {
  display: block !important;
  width: 100% !important;
  padding: 11px !important;
  border-radius: 8px !important;
  border: 1px solid #e5ddd2 !important;
  background: transparent !important;
  color: #e5ddd2 !important;
  font-family: Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  letter-spacing: 0.03em !important;
  transition: color 0.15s, background 0.15s;
  text-align: center !important;
}
#bb-send-btn:hover,
#bb-verify-btn:hover {
  color: #2a1f35 !important;
  background: #e5ddd2 !important;
}
#bb-send-btn:disabled,
#bb-verify-btn:disabled { opacity: 0.5 !important; cursor: not-allowed !important; }

#bb-modal .bb-privacy {
  display: block !important;
  font-family: Arial, sans-serif !important;
  font-size: 11px !important;
  color: #7a6a8a !important;
  margin: 0.75rem 0 1rem !important;
}

#bb-modal .bb-divider {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 0.75rem !important;
  font-family: Arial, sans-serif !important;
  font-size: 10px !important;
  color: #7a6a8a !important;
  width: auto !important;
}
#bb-modal .bb-divider::before,
#bb-modal .bb-divider::after {
  content: '' !important;
  flex: 1 !important;
  height: 0.5px !important;
  background: rgba(255,255,255,0.1) !important;
  display: block !important;
}

#bb-modal .bb-howit {
  display: block !important;
  background: rgba(255,255,255,0.06) !important;
  border-radius: 8px !important;
  padding: 0.75rem !important;
  font-family: Arial, sans-serif !important;
  font-size: 12px !important;
  color: #9e8fad !important;
  line-height: 1.5 !important;
}
#bb-modal .bb-howit strong {
  color: #e5ddd2 !important;
  font-weight: 500 !important;
}

#bb-modal .bb-otp-label {
  display: block !important;
  font-family: Arial, sans-serif !important;
  font-size: 12px !important;
  color: #9e8fad !important;
  margin-bottom: 1rem !important;
}
#bb-otp-email { color: #e5ddd2 !important; }

#bb-modal .bb-otp-boxes {
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  margin-bottom: 14px !important;
  width: auto !important;
}
#bb-modal .bb-otp-box {
  display: inline-block !important;
  width: 52px !important;
  height: 60px !important;
  border-radius: 8px !important;
  border: 0.5px solid rgba(255,255,255,0.2) !important;
  background: rgba(255,255,255,0.08) !important;
  color: #f0eaf8 !important;
  font-size: 24px !important;
  font-family: Arial, sans-serif !important;
  font-weight: 500 !important;
  text-align: center !important;
  outline: none !important;
  caret-color: #e5ddd2;
  flex: none !important;
  max-width: 52px !important;
}
#bb-modal .bb-otp-box:focus { border-color: #e5ddd2 !important; }
#bb-modal .bb-otp-box.bb-box-error { border-color: #c04040 !important; }

#bb-modal .bb-resend {
  display: block !important;
  font-family: Arial, sans-serif !important;
  font-size: 11px !important;
  color: #7a6a8a !important;
  margin-top: 0.75rem !important;
}
#bb-modal .bb-link-btn {
  background: none !important;
  border: none !important;
  color: #e5ddd2 !important;
  cursor: pointer !important;
  font-size: 11px !important;
  font-family: Arial, sans-serif !important;
  padding: 0 !important;
  text-decoration: underline !important;
  display: inline !important;
}
#bb-modal .bb-link-btn:hover { opacity: 0.75 !important; }

#bb-modal .bb-check {
  display: block !important;
  font-size: 28px !important;
  color: #e5ddd2 !important;
  margin-bottom: 0.75rem !important;
}
