/* ==========================================================================
   COMPONENT: WooCommerce Notices
   Shared styles for .woocommerce-message, -error, -info
   Used on cart, checkout, and any page with WC notices.
   ========================================================================== */

.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
  font-family: var(--font-body);
  font-size: var(--text-body-md);
  line-height: 1.5;
  padding: var(--space-4) var(--space-5);
  margin-bottom: var(--space-6);
  border-radius: var(--radius-md);
  list-style: none;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-3);
  animation: noticeSlideIn var(--duration-slow) var(--ease-spring) both;
}

/* Push the message text to the right of the restore-item button */
.woocommerce-message > .button,
.woocommerce-message > .restore-item {
  margin-right: auto;
  order: 2;
}

@keyframes noticeSlideIn {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.woocommerce-message {
  background-color: var(--color-secondary-container, #d6e7a1);
  color: var(--color-on-secondary-container, #1a2008);
  border: 1px solid rgba(90, 104, 47, 0.15);
}

.woocommerce-error {
  background-color: var(--color-error-container, #fce4ec);
  color: var(--color-on-error-container, #93000a);
  border: 1px solid rgba(147, 0, 10, 0.12);
  flex-direction: column;
  align-items: flex-start;
}

.woocommerce-error li { list-style: none; }

.woocommerce-info {
  background-color: var(--color-surface-container, #f1eee6);
  color: var(--color-on-surface);
  border: 1px solid rgba(198, 200, 185, 0.3);
}

.woocommerce-message a,
.woocommerce-error a,
.woocommerce-info a {
  font-weight: 600;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* "Restore item" / "Tagasta toode" — render as a proper outlined button */
.woocommerce-message .button,
.woocommerce-message .restore-item,
.woocommerce-error .button,
.woocommerce-info .button {
  display: inline-flex;
  align-items: center;
  padding: var(--space-2) var(--space-4);
  background-color: transparent;
  color: inherit;
  border: 1px solid currentColor;
  border-radius: var(--radius-pill, 999px);
  font-size: var(--text-body-sm, 0.875rem);
  font-weight: 600;
  text-decoration: none;
  transition: background-color var(--duration-fast) var(--ease-default), color var(--duration-fast) var(--ease-default);
  cursor: pointer;
}

.woocommerce-message .button:hover,
.woocommerce-message .restore-item:hover,
.woocommerce-error .button:hover,
.woocommerce-info .button:hover {
  background-color: currentColor;
}

.woocommerce-message .button:hover,
.woocommerce-message .restore-item:hover {
  color: var(--color-secondary-container, #d6e7a1);
}

.woocommerce-error .button:hover {
  color: var(--color-error-container, #fce4ec);
}

.woocommerce-info .button:hover {
  color: var(--color-surface-container, #f1eee6);
}

.woocommerce-message::before,
.woocommerce-info::before {
  display: none;
}

/* Notices wrapper — ensure WC-injected notices inherit styles */
.woocommerce-notices-wrapper:empty {
  display: none;
}

/* On mobile, keep notices from touching screen edges inside containers */
@media (max-width: 768px) {
  .woocommerce-message,
  .woocommerce-error,
  .woocommerce-info {
    margin-inline: var(--space-1);
  }
}
