/* ==========================================================================
   Free Shipping Notice - front office styles (v1.6.2)
   Contexts: product | cart | modal | checkout
   ========================================================================== */

.fsb-notice {
    --fsb-accent: #C9A227;
    --fsb-accent-dark: #8A6D00;
    --fsb-radius: 8px;

    display: block !important;
    box-sizing: border-box;
    width: 100%;
    margin: 15px 0;
    padding: 12px 14px;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: var(--fsb-radius);
    background-color: #fdf8ec;
    font-size: 14px;
    line-height: 1.45;
    text-align: left;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

.fsb-notice * {
    box-sizing: border-box;
}

/* ---------- message row ---------- */
.fsb-notice__row {
    display: flex !important;
    align-items: flex-start;
    gap: 9px;
}

.fsb-notice__icon {
    flex: 0 0 auto;
    display: inline-flex;
    margin-top: 1px;
    color: var(--fsb-accent);
}

.fsb-notice__icon svg {
    display: block;
    width: 20px;
    height: 20px;
}

.fsb-notice__text {
    flex: 1 1 auto;
    min-width: 0;
}

.fsb-notice .fsb-amount {
    font-weight: 700;
    color: var(--fsb-accent);
    white-space: nowrap;
}

/* ---------- progress bar ---------- */
.fsb-progress {
    display: block !important;
    position: relative;
    height: 18px;
    margin-top: 11px;
    border: 1px solid rgba(0, 0, 0, .18);
    border-radius: 999px;
    background-color: #ffffff;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .10);
    overflow: hidden;
}

.fsb-progress__fill {
    display: block;
    position: relative;
    height: 100%;
    width: 0;
    min-width: 3px;
    border-radius: 999px;
    background-color: var(--fsb-accent-dark);
    background-image: linear-gradient(90deg, var(--fsb-accent), var(--fsb-accent-dark));
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .12);
    transition: width .5s cubic-bezier(.22, .61, .36, 1);
}

/* moving stripes - shown in every state */
.fsb-progress__fill::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background-image: linear-gradient(
        45deg,
        rgba(255, 255, 255, .35) 25%, transparent 25%,
        transparent 50%, rgba(255, 255, 255, .35) 50%,
        rgba(255, 255, 255, .35) 75%, transparent 75%, transparent
    );
    background-size: 20px 20px;
    animation: fsb-stripes 900ms linear infinite;
}

@keyframes fsb-stripes {
    from { background-position: 0 0; }
    to   { background-position: 20px 0; }
}

@media (prefers-reduced-motion: reduce) {
    .fsb-progress__fill::after { animation: none; }
}

/* ---------- labels under the bar ---------- */
.fsb-progress__labels {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    gap: 4px 12px;
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.3;
    opacity: .85;
}

.fsb-progress__goal {
    text-align: right;
    margin-left: auto;
}

.fsb-progress__labels strong {
    font-weight: 700;
    white-space: nowrap;
}

/* ---------- states ---------- */
.fsb-notice--remaining {
    background-color: #fdf8ec;
    color: #6b5514;
    border-color: rgba(201, 162, 39, .35);
}

.fsb-notice--eligible {
    background-color: #eaf7ef;
    color: #1e7e34;
    border-color: #b7e1c1;
}

.fsb-notice--eligible .fsb-notice__icon,
.fsb-notice--eligible .fsb-amount {
    color: #1e7e34;
}

.fsb-notice--eligible .fsb-progress {
    border-color: rgba(30, 126, 52, .35);
}

.fsb-notice--eligible .fsb-progress__fill {
    background-color: #1e9e3e;
    background-image: linear-gradient(90deg, #34c759, #1e9e3e);
}

/* ---------- context: product page ---------- */
.fsb-notice--ctx-product {
    margin: 15px 0;
}

/* ---------- context: cart page ---------- */
.fsb-notice--ctx-cart {
    margin: 0 0 18px;
}

/* ---------- context: add-to-cart modal ---------- */
.fsb-notice--ctx-modal {
    margin: 0 0 16px;
}

/* ---------- context: checkout sidebar (narrow column) ---------- */
.fsb-notice--ctx-checkout {
    margin: 16px 0 18px;
    padding: 10px 12px;
    font-size: 13px;
    line-height: 1.4;
    border-radius: 6px;
}

.fsb-notice--ctx-checkout .fsb-notice__row {
    gap: 8px;
}

.fsb-notice--ctx-checkout .fsb-notice__icon svg {
    width: 17px;
    height: 17px;
}

.fsb-notice--ctx-checkout .fsb-progress {
    height: 16px;
    margin-top: 10px;
}

.fsb-notice--ctx-checkout .fsb-progress__labels {
    margin-top: 5px;
    font-size: 11.5px;
}

/* Keep the notice from inheriting odd theme rules inside the summary */
.fsb-notice--ctx-checkout p,
.fsb-notice--ctx-checkout span {
    margin: 0;
    padding: 0;
    float: none;
}

/* ---------- small screens ---------- */
@media (max-width: 575px) {
    .fsb-notice {
        padding: 10px 12px;
        font-size: 13px;
    }

    .fsb-progress__labels {
        font-size: 11.5px;
    }
}