/* ==========================================
   NOTICES COMPONENT
   Depends on: master.css (variables)
   ========================================== */

/* Hide WooCommerce's native notices via CSS ONLY — logic never touched,
   per Global Rules. wc_print_notices() still runs and clears the session
   normally; we just never show its rendered output to the visitor. */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info,
.woocommerce-notice {
  display: none !important;
}

.branded-notices {
  position: fixed;
  top: var(--space-5);
  left: 50%;
  transform: translateX(-50%);
  z-index: var(--z-toast);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  width: 90%;
  max-width: 480px;
  pointer-events: none;
}

.branded-notice {
  pointer-events: auto;
  font-size: var(--text-small);
  color: var(--color-white);
  background-color: var(--color-surface-2);
  border: 1px solid var(--color-border-mid);
  border-radius: var(--radius-base);
  padding: var(--space-4) var(--space-5);
  box-shadow: var(--shadow-lg);
  animation: notice-slide-in var(--t-slow) ease-out;
}

.branded-notice--success {
  border-color: var(--color-success);
}

.branded-notice--error {
  border-color: var(--color-danger);
}

.branded-notice--notice {
  border-color: var(--color-info);
}

.branded-notice.is-leaving {
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

@keyframes notice-slide-in {
  from {
    opacity: 0;
    transform: translateY(-12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}