/* ============================================================
   BYC 2026 - WooCommerce notices / toasts (shared).

   The "You cannot add another X to your cart" error, the "added
   to your order" message, and info notices + their action button
   (View cart / .wc-forward). These fire on EVERY Woo surface -
   shop archive, single product, cart, checkout - so this sheet is
   enqueued on ALL of them. Previously the notice styling lived only
   in byc-woo.css (cart/checkout), leaving the product/shop notice
   with default Astra/Woo chrome: near-black text on the near-black
   canvas, a broken Woo icon-font glyph, and a low-contrast button.

   Color tokens (--surface/--accent/--line/--text...) are provided
   by whichever page sheet is also loaded (byc-shop / byc-product /
   byc-woo all define them on their pages).
   ============================================================ */

/* notice surface: dark card, accent left rail, readable text */
body.byc-2026 .woocommerce-notices-wrapper{margin:0 0 6px}
body.byc-2026 .woocommerce-message,
body.byc-2026 .woocommerce-error,
body.byc-2026 .woocommerce-info{
  background:var(--surface);border:1px solid var(--line);
  border-left:3px solid var(--accent);border-radius:6px;
  color:var(--text);font-family:var(--sans);font-size:15px;line-height:1.5;
  padding:15px 18px;margin:0 0 16px;list-style:none;
  overflow:hidden}                         /* contain the floated action button */

/* ERROR notice: stronger red emphasis (thicker left bar + soft red tint fading
   from the left) so a problem reads instantly. Reserves bold red for errors. */
body.byc-2026 .woocommerce-error{
  border-left:4px solid var(--accent) !important;
  background:linear-gradient(90deg, rgba(242,32,46,.12), rgba(242,32,46,0) 240px), var(--surface);
}

/* links inside notices */
body.byc-2026 .woocommerce-message a:not(.button),
body.byc-2026 .woocommerce-error a:not(.button),
body.byc-2026 .woocommerce-info a:not(.button){color:var(--accent-dim)}
body.byc-2026 .woocommerce-message a:not(.button):hover,
body.byc-2026 .woocommerce-error a:not(.button):hover,
body.byc-2026 .woocommerce-info a:not(.button):hover{color:var(--text)}

/* Woo/Astra position an icon ::before via the WooCommerce icon font - which is
   often not loaded here, so it renders as a broken/tofu glyph over our text.
   Kill it; the red left rail IS the marker. */
body.byc-2026 .woocommerce-message::before,
body.byc-2026 .woocommerce-error::before,
body.byc-2026 .woocommerce-info::before,
body.byc-2026 .woocommerce-message li::before,
body.byc-2026 .woocommerce-error li::before,
body.byc-2026 .woocommerce-info li::before{display:none !important;content:none !important}
body.byc-2026 .woocommerce-message li,
body.byc-2026 .woocommerce-error li,
body.byc-2026 .woocommerce-info li{margin:0;padding:0;list-style:none}

/* action button inside a notice (View cart / Continue) = clear white button,
   floated to the right of the message text (Woo's default position). Scoped to
   buttons INSIDE a notice so it never hits the big Proceed-to-checkout /
   Return-to-shop .wc-forward buttons. */
body.byc-2026 .woocommerce-message a.button,
body.byc-2026 .woocommerce-error a.button,
body.byc-2026 .woocommerce-info a.button{
  float:right;margin:-1px 0 0 18px;
  display:inline-flex;align-items:center;height:36px;padding:0 16px;
  font-family:var(--mono);font-size:12px;letter-spacing:.04em;font-weight:600;
  background:#fff;color:#000;border:1px solid #fff;border-radius:6px;
  text-decoration:none;line-height:1;transition:.16s ease}
body.byc-2026 .woocommerce-message a.button:hover,
body.byc-2026 .woocommerce-error a.button:hover,
body.byc-2026 .woocommerce-info a.button:hover{
  background:var(--accent);color:#fff;border-color:var(--accent);
  box-shadow:0 0 24px var(--accent-glow)}

/* product page: notices live in their own .wrap below the sticky nav */
body.byc-2026 .byc-notice-wrap{padding-top:24px}

/* empty cart info */
body.byc-2026 .cart-empty{font-size:16px;color:var(--text-muted)}
body.byc-2026 .return-to-shop{margin-top:18px}

/* phone: button drops below the text rather than crowding it */
@media(max-width:520px){
  body.byc-2026 .woocommerce-message a.button,
  body.byc-2026 .woocommerce-error a.button,
  body.byc-2026 .woocommerce-info a.button{float:none;margin:12px 0 0;width:100%;justify-content:center}
}

/* pulse keyframes (standing rule: every 2026 stylesheet ships them) */
@keyframes bycPulse{0%,100%{box-shadow:0 0 0 4px var(--accent-glow)}
  50%{box-shadow:0 0 0 8px rgba(242,32,46,.07)}}