/* Wrapper das notices: fixo no fundo da janela */
.woocommerce-notices-wrapper {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 20px;
  z-index: 9999;
  width: 100%;
  display: flex;
  justify-content: center;
  pointer-events: none; /* não bloquear cliques atrás */
}

/* Contentor interno para controlar a largura em desktop */
.woocommerce-notices-wrapper > ul,
.woocommerce-notices-wrapper > div[role="alert"],
.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info {
  max-width: 480px;
  width: 100%;
  margin: 0 12px;
}

/* Estilo base para todos os tipos de notice / alert, incluindo as criadas via JS (.wc-js-alert) */
.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-notice,
.woocommerce-notices-wrapper .woocommerce-notice--success,
.woocommerce-notices-wrapper .woocommerce-notice--error,
.woocommerce-notices-wrapper .woocommerce-notice--info,
.woocommerce-notices-wrapper [role="alert"],
.woocommerce-notices-wrapper .wc-js-alert {
  list-style: none;
  margin: 0;
  padding: 12px 16px;
  border-radius: 6px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
  font-size: 14px;
  line-height: 1.4;
  background: #222222;  /* fundo escuro */
  color: #ffffff;       /* texto branco */
  opacity: 0.7;         /* transparência */
  pointer-events: auto; /* permite clicar em links/texto dentro */
  animation: wc-pro-notice-hide 0.3s ease 7s forwards; /* 7s antes de desaparecer */
}

/* Garantir que li não estragam spacing */
.woocommerce-notices-wrapper .woocommerce-error li,
.woocommerce-notices-wrapper .woocommerce-message li,
.woocommerce-notices-wrapper .woocommerce-info li {
  margin: 0;
}

/* Outline / borda colorida por tipo */

/* Erro (vermelho) – inclui .wc-js-alert */
.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-notice--error,
.woocommerce-notices-wrapper .woocommerce-error[role="alert"],
.woocommerce-notices-wrapper .wc-js-alert {
  border-left: 4px solid #e53935;
}

/* Sucesso (verde) */
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-notice--success {
  border-left: 4px solid #43a047;
}

/* Info (azul) */
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-notice--info {
  border-left: 4px solid #1e88e5;
}

/* Animação para desaparecer depois de ~7s */
@keyframes wc-pro-notice-hide {
  from {
    opacity: 0.7;
    transform: translateY(0);
    visibility: visible;
  }
  to {
    opacity: 0;
    transform: translateY(6px);
    visibility: hidden;
  }
}

/* Mobile: barra largura total */
@media (max-width: 768px) {
  .woocommerce-notices-wrapper {
    bottom: 12px;
  }

  .woocommerce-notices-wrapper > ul,
  .woocommerce-notices-wrapper > div[role="alert"],
  .woocommerce-notices-wrapper .woocommerce-error,
  .woocommerce-notices-wrapper .woocommerce-message,
  .woocommerce-notices-wrapper .woocommerce-info {
    max-width: 100%;
    width: 100%;
    margin: 0;         /* ocupar mesmo a largura toda */
    border-radius: 0;  /* barra reta em mobile (opcional) */
  }
}