/* ===== RDP GPU Mart — WooCommerce notice component (2026-08-20) =====
   ONE stylesheet for every surface that renders the Blocks notice banner (cart, checkout,
   my-account, order-received), so the component cannot diverge between pages.

   FINDING that reframes #269: the focus ring is NOT the browser's UA ring. WooCommerce's own
   wc-blocks.css declares it:
       .wc-block-components-notice-banner:focus{outline-width:0}
       .wc-block-components-notice-banner:focus-visible{outline-style:solid;outline-width:2px}
   It sets style and width but NEVER outline-color, so the colour falls back to whatever the
   context supplies — measured amber rgb(229,151,0) on checkout and rgba(216,34,40,.28) on
   my-account. An indicator with no declared colour, not a stray browser artefact.

   Therefore we DECLARE the colour rather than delete the indicator. Deleting it would strip a
   deliberate WooCommerce accessibility affordance — "a focus indicator removed without a
   replacement is an a11y regression wearing a brand-fix costume". This also supersedes the
   checkout-only `outline:none` shipped on 2026-08-20, which is removed from gmcheckout.css.
   GR6: keyboard focus -> clearly visible RED indicator. Mouse focus stays clean because
   wc-blocks.css already zeroes :focus (not :focus-visible). */

.wc-block-components-notice-banner:focus-visible{
  outline-color:rgba(216,34,40,.55);
  outline-offset:2px}

/* ---- Error icon --------------------------------------------------------------------
   WooCommerce ships an "i" (information) glyph on the ERROR banner. On the page where a
   buyer commits, the highest-anxiety state should not carry the calmest mark in the set.
   Swapped for a filled alert disc with a knocked-out "!", which also stays legible at 24px —
   the old thin ring merged into a blob below ~24px (that, not `fill`, caused the "flat dot").

   §109: the replacement is a HOSTED .svg. An inline data:image/svg+xml URI in a server-served
   stylesheet trips ModSecurity on this host and 403s the entire file. Same pattern as
   uploads/2026/07/gm-chevron-down.svg.
   No template override — the shipped <svg> box is kept for layout, its path is hidden, and the
   replacement is painted as a background on that same box.
   Scoped to .is-error ONLY, so the success and info variants keep their own icons. */
.wc-block-components-notice-banner.is-error>svg{
  width:24px;height:24px;flex:0 0 24px;
  background-image:url('https://rdp.in/gpu-mart/wp-content/uploads/2026/07/gm-notice-error.svg');
  background-repeat:no-repeat;
  background-position:center;
  background-size:24px 24px}
.wc-block-components-notice-banner.is-error>svg>path{display:none}

/* --- Banner card ------------------------------------------------------------------
   MOVED here from gmcheckout.css (2026-08-20 -> 2026-08-21). The card treatment was scoped
   to .woocommerce-checkout, so cart / my-account / order-received rendered WooCommerce's
   default pink at radius 4 while checkout showed the white brand card.
   Re-scoped to .woocommerce-page, which body carries on every WooCommerce surface — same
   specificity as before ((0,2,0) base, (0,3,0) for .is-error), so checkout is unchanged
   while the other three inherit the component. Specificity matters here: wc-blocks.css
   sets the card at (0,1,0)/(0,2,0) and loads AFTER this file, so a bare
   .wc-block-components-notice-banner would lose. Measured, not assumed. */
.woocommerce-page .wc-block-components-notice-banner{
  background:#fff;border:1px solid #e6e6e6;border-left:3px solid #d82228;border-radius:14px;
  box-shadow:0 1px 2px rgba(0,0,0,.06);padding:15px 18px;color:#3a3a3a}
.woocommerce-page .wc-block-components-notice-banner.is-error{background:#fff}
.woocommerce-page .wc-block-components-notice-banner a{color:#3a3a3a;text-decoration:none;font-weight:600}
.woocommerce-page .wc-block-components-notice-banner a:hover{color:#d82228;text-decoration:underline}
.woocommerce-page .wc-block-components-notice-banner ul{margin:6px 0 0;padding-left:18px}
.woocommerce-page .wc-block-components-notice-banner li{margin:3px 0;font-size:13.5px;line-height:1.5}
