/* INSYGMA · Ofertas por valor: o frasco (recortado, sem fundo) no lugar da bola na escada.
   O tema desenha bolas (.ship-dot no sidecart, .cart-reward-dot no carrinho) e o camião dos
   portes num círculo de 34 px. O marcador de oferta é só o frasco, assente na barra, com sombra;
   visto no canto quando desbloqueado (verde quando está tudo desbloqueado); esbatido enquanto
   falta. As classes de estado (.is-on, .is-success, .cart-shipping-achieved) são as do tema.
   O JS marca o contentor com .insy-has-gift-markers para a barra ganhar espaço para o frasco.
   Larguras explícitas: o último marcador fica em left:100% e com width:auto o browser dá-lhe
   largura zero (não há espaço à direita para o shrink-to-fit). Os sprites têm proporção 0,59. */

/* --- espaço à volta da barra quando há frascos --- */
.shipping-widget.insy-has-gift-markers .ship-track { margin-top: 28px; }
.shipping-widget.insy-has-gift-markers { padding-bottom: 30px; }
#insygma-header-section #cart-page-free-shipping-bar-container.insy-has-gift-markers .cart-reward-track { margin-top: 36px; }
#insygma-header-section #cart-page-free-shipping-bar-container.insy-has-gift-markers .cart-reward-banner { margin-top: 38px; }
#insygma-header-section #cart-page-free-shipping-bar-container.insy-has-gift-markers .cart-reward-track:has(+ .cart-reward-banner.is-hidden) { margin-bottom: 36px; }

/* --- o marcador deixa de ser uma bola --- */
.ship-dot.insy-gift-dot,
#insygma-header-section .cart-reward-dot.insy-gift-dot {
    width: 26px;
    height: 44px;
    padding: 0;
    overflow: visible;
    border-radius: 0;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    transform: translate(-50%, -54%) !important;   /* o frasco assenta na barra, um pouco acima do centro */
    z-index: 4;
}
#insygma-header-section .cart-reward-dot.insy-gift-dot { width: 33px; height: 56px; }

.insy-gift-dot > .insy-gift-photo {
    position: absolute;
    inset: 0;
    display: block;
    border-radius: 0;
    overflow: visible;
    background: none;
}
.insy-gift-dot > .insy-gift-photo > img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    object-position: center bottom;
    transform: none;
    filter: drop-shadow(0 5px 9px rgba(15, 23, 42, 0.22)) grayscale(0.7) opacity(0.6);
    transition: filter 0.3s ease;
}
.insy-gift-dot.is-on > .insy-gift-photo > img {
    filter: drop-shadow(0 5px 9px rgba(15, 23, 42, 0.22));
}

/* --- visto no canto inferior direito do frasco, só quando desbloqueado --- */
.insy-gift-dot > .insy-gift-check {
    position: absolute;
    right: -8px;
    bottom: 2px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #2563EB;
    color: #FFFFFF;
    border: 2px solid #FFFFFF;
    display: none;
    align-items: center;
    justify-content: center;
    box-sizing: content-box;
    box-shadow: 0 2px 5px rgba(15, 23, 42, 0.18);
    z-index: 1;
}
.insy-gift-dot.is-on > .insy-gift-check { display: flex; }
.insy-gift-dot > .insy-gift-check svg { width: 8px; height: 8px; }
#insygma-header-section .cart-reward-dot.insy-gift-dot > .insy-gift-check {
    width: 16px;
    height: 16px;
    right: -9px;
    bottom: 3px;
}
#insygma-header-section .cart-reward-dot.insy-gift-dot > .insy-gift-check svg { width: 9px; height: 9px; }

/* --- tudo desbloqueado: visto verde, como o tema faz com as bolas --- */
.shipping-widget.is-success .insy-gift-dot.is-on > .insy-gift-check,
#insygma-header-section #cart-page-free-shipping-bar-container.cart-shipping-achieved .insy-gift-dot.is-on > .insy-gift-check {
    background: #059669;
}

@media (max-width: 767px) {
    #insygma-header-section .cart-reward-dot.insy-gift-dot { width: 28px; height: 48px; }
    #insygma-header-section #cart-page-free-shipping-bar-container.insy-has-gift-markers .cart-reward-track { margin-top: 30px; }
}

/* --- v1.4.0: frasco no fim da barra alinha pelo fim (mesmo respiro do lado esquerdo) ---
   v1.5.1: deslizado 4 px para a direita (pedido do dono): o corpo do frasco tem ~1 px de margem
   transparente e o remate arredondado da barra espreitava por trás. O JS desconta os mesmos 4 px
   (END_SHIFT) para o azul continuar a parar 6 px antes do frasco bloqueado. */
.ship-dot.insy-gift-dot.insy-at-end,
#insygma-header-section .cart-reward-dot.insy-gift-dot.insy-at-end {
    transform: translate(calc(-100% + 4px), -54%) !important;
}
.insy-gift-dot.insy-at-end > .insy-gift-check { right: 1px; }

/* --- v1.4.0: camião no nível de portes grátis do sidecart (o carrinho já o tem) --- */
.ship-dot.insy-ship-dot {
    width: 26px;
    height: 26px;
    background: #FFFFFF;
    border: 1px solid rgba(226, 232, 240, 0.95);
    color: #64748B;
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.12);
    z-index: 4;
}
.ship-dot.insy-ship-dot > .insy-truck { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.ship-dot.insy-ship-dot > .insy-truck svg { width: 14px; height: 14px; }
.ship-dot.insy-ship-dot.is-on {
    background: #2563EB;
    border-color: #2563EB;
    color: #FFFFFF;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12), 0 6px 14px rgba(15, 23, 42, 0.13);
}
.shipping-widget.is-success .ship-dot.insy-ship-dot.is-on {
    background: #059669;
    border-color: #059669;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.13), 0 6px 14px rgba(15, 23, 42, 0.13);
}