/**
 * Free shipping counter (cart page, checkout summary, add-to-cart window,
 * free placement). Colours and radius come from the merchant settings
 * through custom properties set inline on the block. The block is not
 * master of its container: a theme can paint a dark card with white text
 * around it, so every element imposes its own colour, size and spacing.
 *
 * @author    Graphik Impact <contact@graphik-impact.com>
 * @copyright 2026 Graphik Impact
 * @license   Proprietary
 */
.ashc-fs { --ashc-fs-accent: #16a34a; --ashc-fs-bar: #16a34a; --ashc-fs-border: #16a34a; --ashc-fs-bg: #f0fdf4; --ashc-fs-text: #1a232a; --ashc-fs-radius: 6px; display: block; margin: 0 0 16px; box-sizing: border-box; text-align: left; font-size: 15px; line-height: 1.4; }
.ashc-fs--box { background: var(--ashc-fs-bg) !important; border: 1px solid var(--ashc-fs-border) !important; border-radius: var(--ashc-fs-radius); padding: 12px 16px; }
.ashc-fs--line { background: transparent !important; border: 0 !important; border-bottom: 2px solid var(--ashc-fs-border) !important; padding: 8px 0; }
.ashc-fs--noborder { border: 0 !important; }
.ashc-fs--center { text-align: center; }
.ashc-fs .ashc-fs-text { display: block !important; justify-content: normal !important; margin: 0 !important; padding: 0 !important; color: var(--ashc-fs-text) !important; font-size: 15px !important; line-height: 1.4 !important; font-weight: 400 !important; text-transform: none !important; letter-spacing: normal !important; text-align: inherit; }
.ashc-fs .ashc-fs-before,
.ashc-fs .ashc-fs-after { color: inherit !important; font-size: inherit !important; font-weight: inherit !important; vertical-align: baseline; }
.ashc-fs .ashc-fs-amount { color: var(--ashc-fs-accent) !important; font-weight: 700 !important; font-size: inherit !important; white-space: nowrap; vertical-align: baseline; }
/* The icon is a box of the text height, centred on the line: it sits at the
   optical middle of lowercase text whatever the theme line-height. Its size
   is pinned to the sentence: a theme enlarging every span of the cart
   summary (boutique-marina, 20px) would otherwise enlarge the box and push
   the icon below the line. */
.ashc-fs .ashc-fs-icon { display: inline-block; width: 1.15em; height: 1.4em; margin: 0 6px 0 0 !important; padding: 0 !important; color: var(--ashc-fs-accent) !important; font-size: inherit !important; vertical-align: top !important; line-height: 0 !important; }
.ashc-fs .ashc-fs-icon svg { display: block; width: 1.15em; height: 1.15em; margin-top: 0.125em; }
.ashc-fs .ashc-fs-bar { height: 6px; margin: 8px 0 0 !important; padding: 0 !important; border-radius: 3px; background: rgba(0, 0, 0, 0.08) !important; overflow: hidden; }
.ashc-fs .ashc-fs-bar-fill { height: 100%; background: var(--ashc-fs-bar) !important; border-radius: 3px; transition: width 0.3s ease; }
.ashc-fs--reached .ashc-fs-bar-fill { width: 100%; }
.ashc-fs--center .ashc-fs-bar { margin-left: auto !important; margin-right: auto !important; max-width: 320px; }
.ashc-fs-host[hidden] { display: none !important; }
.cart-summary > .cart-summary-top { padding: 16px 16px 0; }
.cart-summary > .cart-summary-top .ashc-fs { margin-bottom: 0; }
.cart-content .ashc-fs { margin: 12px 0 !important; }
.ashc-cart-notice + .ashc-fs { margin-top: 8px; }