/**
 * BVUNZO user-facing notices (flash messages, inline status, form errors).
 * See docs/UI_DESIGNS/USER_NOTICES.md
 */

.bv-flash-stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 12px);
  margin-bottom: var(--space-4, 16px);
}

.bv-notice,
.msg {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3, 12px);
  padding: var(--space-4, 16px) var(--space-4, 16px);
  margin-bottom: var(--space-4, 16px);
  border-radius: var(--radius-md, 16px);
  border: 1px solid transparent;
  font-size: 0.875rem;
  line-height: 1.5;
  box-shadow: var(--shadow-sm, 0 2px 8px rgba(15, 34, 45, 0.06));
}

.bv-flash-stack .bv-notice,
.bv-flash-stack .msg {
  margin-bottom: 0;
}

.bv-notice__icon,
.msg > .bi:first-child {
  flex-shrink: 0;
  margin-top: 0.1rem;
  font-size: 1.2rem;
  line-height: 1;
}

.bv-notice__content,
.msg > .bi:first-child + * {
  flex: 1;
  min-width: 0;
}

.bv-notice__title {
  margin: 0 0 0.25rem;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.35;
}

.bv-notice__text,
.bv-notice__content > :last-child {
  margin: 0;
}

.bv-notice__text p,
.bv-notice__content p {
  margin: 0;
}

.bv-notice__text p + p,
.bv-notice__content p + p {
  margin-top: 0.35rem;
}

/* Variants */
.bv-notice--success,
.msg.success {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}

.bv-notice--success .bv-notice__icon,
.msg.success > .bi,
.msg.success::before {
  color: var(--brand-primary, #3bb54a);
}

.bv-notice--error,
.msg.error {
  background: #fef2f2;
  border-color: #fecaca;
  color: #991b1b;
}

.bv-notice--error .bv-notice__icon,
.msg.error > .bi,
.msg.error::before {
  color: #dc2626;
}

.bv-notice--warn,
.msg.warning {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}

.bv-notice--warn .bv-notice__icon,
.msg.warning > .bi,
.msg.warning::before {
  color: #d97706;
}

.bv-notice--info,
.msg.info {
  background: #f8fafc;
  border-color: var(--border-soft, #e5eaf0);
  color: var(--brand-navy, #0f222d);
}

.bv-notice--info .bv-notice__icon,
.msg.info > .bi,
.msg.info::before {
  color: var(--brand-primary, #3bb54a);
}

/* Legacy .msg without <i> child — icon via Bootstrap Icons font */
.msg:not(:has(.bi))::before {
  font-family: "bootstrap-icons";
  display: block;
  flex-shrink: 0;
  margin-top: 0.1rem;
  font-size: 1.2rem;
  line-height: 1;
}

.msg.success:not(:has(.bi))::before {
  content: "\f26b";
}

.msg.error:not(:has(.bi))::before {
  content: "\f33a";
}

.msg.warning:not(:has(.bi))::before {
  content: "\f33b";
}

.msg.info:not(:has(.bi))::before {
  content: "\f430";
}

/* Billing alerts — same component */
.billing-alert {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3, 12px);
  padding: var(--space-4, 16px);
  margin-bottom: var(--space-4, 16px);
  border-radius: var(--radius-md, 16px);
  border: 1px solid transparent;
  font-size: 0.875rem;
  line-height: 1.5;
  box-shadow: var(--shadow-sm, 0 2px 8px rgba(15, 34, 45, 0.06));
}

.billing-alert .bi {
  flex-shrink: 0;
  margin-top: 0.1rem;
  font-size: 1.2rem;
}

.billing-alert strong {
  display: block;
  margin-bottom: 0.2rem;
  font-weight: 700;
}

.billing-alert--error {
  background: #fef2f2;
  border-color: #fecaca;
  color: #991b1b;
}

.billing-alert--error .bi {
  color: #dc2626;
}

.billing-alert--warn {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}

.billing-alert--warn .bi {
  color: #d97706;
}

.billing-alert--info {
  background: #f8fafc;
  border-color: var(--border-soft, #e5eaf0);
  color: var(--brand-navy, #0f222d);
}

.billing-alert--info .bi {
  color: var(--brand-primary, #3bb54a);
}

.billing-alert--success {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}

.billing-alert--success .bi {
  color: var(--brand-primary, #3bb54a);
}

.billing-alert--tight {
  margin-bottom: 0;
}

/* Auth / onboarding form errors */
.login-form__errors,
.signup-form__errors,
.signup-form__errors--summary,
.learn-onboarding__error,
.auth-flow-page .learn-onboarding__error {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3, 12px);
  padding: var(--space-4, 16px);
  margin-bottom: var(--space-4, 16px);
  border-radius: var(--radius-md, 16px);
  border: 1px solid #fecaca;
  background: #fef2f2;
  color: #991b1b;
  font-size: 0.875rem;
  line-height: 1.5;
  box-shadow: var(--shadow-sm, 0 2px 8px rgba(15, 34, 45, 0.06));
  text-align: left;
}

.login-form__errors::before,
.signup-form__errors::before,
.signup-form__errors--summary::before,
.learn-onboarding__error::before {
  font-family: "bootstrap-icons";
  content: "\f33a";
  flex-shrink: 0;
  font-size: 1.2rem;
  color: #dc2626;
}

.login-form__errors p,
.signup-form__errors p,
.signup-form__error {
  margin: 0;
  color: inherit;
  font-weight: 600;
}

.signup-form__error-list {
  margin: 0.35rem 0 0;
  padding-left: 1.1rem;
}

.signup-form__error-title {
  margin: 0;
  font-weight: 700;
}