/* On-brand toast for WooCommerce notices (replaces the default full-width green
   "added to cart" banner). Positioned top-right, near the cart icon. Success/info =
   teal check; error = deep red X. Auto-dismiss is handled by js/bollypiano_notices.js.

   Two containers are targeted in place: the plain `.woocommerce-notices-wrapper` used
   on standard WooCommerce pages (cart, account) and Elementor Pro's
   `.e-woocommerce-notices-wrapper`, which the single-product template's WooCommerce
   Notices widget renders into (and owns, so the notice is styled where it sits rather
   than relocated). Top-right placement also avoids Elementor's "scroll the notice to
   the centre of the viewport" behaviour: a top-anchored fixed notice resolves to a
   scroll target of ~0, so the page does not jump. */

.woocommerce-notices-wrapper,
.e-woocommerce-notices-wrapper{
  position:fixed !important;
  /* below the sticky header (~107px desktop) so it clears the search bar */
  top:116px; right:20px; left:auto; bottom:auto;
  z-index:100000;
  width:min(360px, calc(100vw - 40px));
  margin:0; padding:0;
  display:flex; flex-direction:column; gap:10px;
  background:none !important; border:0 !important; box-shadow:none !important;
  pointer-events:none;
}
.woocommerce-notices-wrapper:empty,
.e-woocommerce-notices-wrapper:empty{display:none}

.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error,
.e-woocommerce-notices-wrapper .woocommerce-message,
.e-woocommerce-notices-wrapper .woocommerce-info,
.e-woocommerce-notices-wrapper .woocommerce-error{
  pointer-events:auto;
  cursor:pointer; /* click anywhere on the toast to dismiss (see js/bollypiano_notices.js) */
  position:relative;
  margin:0 !important;
  padding:14px 16px 14px 48px !important;
  background:#FFFBF3 !important;
  border:1px solid rgba(0,21,36,.12) !important;
  border-left:3px solid #15616D !important;
  border-radius:12px !important;
  box-shadow:0 16px 38px -16px rgba(0,21,36,.4) !important;
  color:#001524 !important;
  font-family:"Hanken Grotesk", system-ui, -apple-system, sans-serif !important;
  font-size:.92rem !important;
  line-height:1.45 !important;
  list-style:none !important;
  display:flex !important;
  align-items:center; gap:12px; flex-wrap:wrap;
  outline:none !important; /* WooCommerce auto-focuses the notice; hide the blue ring */
  animation:bp-toast-in .28s cubic-bezier(.2,.8,.2,1) both;
}

/* status icon (replaces WooCommerce's default green tick) */
.woocommerce-notices-wrapper .woocommerce-message::before,
.woocommerce-notices-wrapper .woocommerce-info::before,
.e-woocommerce-notices-wrapper .woocommerce-message::before,
.e-woocommerce-notices-wrapper .woocommerce-info::before{
  content:"" !important;
  position:absolute; left:15px; top:16px;
  width:22px; height:22px; border-radius:50%;
  background:#15616D url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 13px no-repeat;
  color:transparent !important;
  font-size:0 !important;
}
.woocommerce-notices-wrapper .woocommerce-error,
.e-woocommerce-notices-wrapper .woocommerce-error{border-left-color:#78290F !important}
.woocommerce-notices-wrapper .woocommerce-error::before,
.e-woocommerce-notices-wrapper .woocommerce-error::before{
  content:"" !important;
  position:absolute; left:15px; top:16px;
  width:22px; height:22px; border-radius:50%;
  background:#78290F url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") center / 12px no-repeat;
  color:transparent !important; font-size:0 !important;
}

/* "View cart" action becomes a quiet accent link on the right */
.woocommerce-notices-wrapper .woocommerce-message .button,
.woocommerce-notices-wrapper .woocommerce-message a.wc-forward,
.e-woocommerce-notices-wrapper .woocommerce-message .button,
.e-woocommerce-notices-wrapper .woocommerce-message a.wc-forward{
  order:2; margin-left:auto !important;
  background:transparent !important;
  color:#78290F !important;
  border:0 !important; box-shadow:none !important;
  padding:0 !important; min-height:0 !important;
  font-weight:600 !important; font-size:.88rem !important;
  text-transform:none !important; white-space:nowrap;
  text-decoration:underline; text-underline-offset:3px;
}
.woocommerce-notices-wrapper .woocommerce-message .button:hover,
.woocommerce-notices-wrapper .woocommerce-message a.wc-forward:hover,
.e-woocommerce-notices-wrapper .woocommerce-message .button:hover,
.e-woocommerce-notices-wrapper .woocommerce-message a.wc-forward:hover{color:#E86E00 !important}

/* the empty AJAX-target wrapper WooCommerce nests inside the message */
.woocommerce-message .woocommerce-notices-wrapper{display:none !important}

/* The empty-cart message is page content, not a transient toast. Elementor's Notices
   widget collects `.cart-empty` into the notices wrapper (sometimes duplicated); suppress
   that copy so it never floats. The cart shortcode renders its own inline empty state. */
.woocommerce-notices-wrapper .cart-empty,
.e-woocommerce-notices-wrapper .cart-empty{display:none !important}

@keyframes bp-toast-in{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:translateY(0)}}

/* fade-out state set by js before removal */
.bp-toast-out{opacity:0 !important;transform:translateY(-10px) !important;transition:opacity .35s ease, transform .35s ease !important}

@media(max-width:600px){
  /* mobile header is taller (~148px) */
  .woocommerce-notices-wrapper,
  .e-woocommerce-notices-wrapper{right:12px; left:12px; top:158px; width:auto}
}