/** Shopify CDN: Minification failed

Line 235:0 Expected "}" to go with "{"

**/
.price .price__badge-sale {
    display: flex!important;
    align-items: center;
    max-width: 59px;
    max-height: 31px;
    padding-left: 5px;
    padding-right: 5px;
    justify-content: center;
    font-size: 11px;
}

.price.price--large.price--on-sale.price--show-badge {
    display: flex;
    align-items: end;
}

.payment-toggle p {
    margin-top: 10px;
}

.payment-toggle p {
    margin: 0;
}

ul.icon-with-text.icon-with-text--vertical.list-unstyled {
    margin-top: 0;
}

/* === Benefits bar (Cart Drawer) === */
.sb-benefits{
  padding: 14px 14px 8px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  margin: 10px 12px 6px;
  background: rgba(255,255,255,.65);
  backdrop-filter: blur(8px);
}

.sb-title{
  margin: 0 0 10px;
  font-weight: 600;
  font-size: 14px;
}

.sb-track{
  position: relative;
  height: 62px;
  border-radius: 12px;
  background: rgba(22,163,74,.08);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 0 10px;
}

.sb-bar{
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 0%;
  background: rgba(22,163,74,.22);
  transition: width .35s ease;
}

.sb-step{
  position: relative;
  z-index: 2;
  display: grid;
  justify-items: center;
  gap: 6px;
  min-width: 80px;
}

.sb-icon{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 13px;
  background: rgba(0,0,0,.06);
  color: rgba(0,0,0,.65);
  transition: all .25s ease;
}

.sb-label{
  font-size: 11px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgba(0,0,0,.55);
  font-weight: 600;
}

.sb-step.is-active .sb-icon{
  background: rgba(22,163,74,.95);
  color: #fff;
}

.sb-step.is-active .sb-label{
  color: rgba(0,0,0,.75);
}

.sb-msg{
  margin: 10px 0 0;
  font-size: 13px;
  color: rgba(0,0,0,.72);
}

/* =========================
   Ajuste fino — barra benefícios no Cart Drawer
   ========================= */

/* garante que o header aceite uma segunda linha (a barra) sem quebrar o X */
#CartDrawer .drawer__header{
  flex-wrap: wrap;
  gap: 10px;
}

/* faz a barra ocupar 100% e ir para baixo do título */
#CartDrawer .drawer__header .sb-benefits{
  width: 100%;
  order: 3;
  margin: 0;
}

/* respira nas laterais e evita “estourar” */
#CartDrawer .sb-benefits{
  margin: 0 12px 8px;
  padding: 12px 12px 10px;
}

/* track mais baixo e com alinhamento mais “premium” */
#CartDrawer .sb-track{
  height: 58px;
  padding: 0 8px;
  border-radius: 12px;
}

/* passos mais compactos e centralizados */
#CartDrawer .sb-step{
  min-width: 72px;
  gap: 6px;
}

/* ícones ligeiramente menores e alinhados */
#CartDrawer .sb-icon{
  width: 32px;
  height: 32px;
  border-radius: 10px;
  font-size: 12px;
}

/* label sem quebrar linha e com melhor leitura */
#CartDrawer .sb-label{
  font-size: 10px;
  white-space: nowrap;
  letter-spacing: .05em;
}

/* mensagem final mais alinhada */
#CartDrawer .sb-msg{
  margin-top: 10px;
}
:root{
  --simp-royal: #1D3557;   /* azul royal oficial Simplicité */
  --simp-gold:  #c8a24a;   /* dourado elegante (se quiser, me passe o hex do dourado oficial) */
  --simp-black: #111111;
  --simp-bg:    #ffffff;
  --simp-line:  rgba(17,17,17,.10);
}

/* container */
#CartDrawer .sb-benefits{
  background: var(--simp-bg);
  border: 1px solid var(--simp-line);
  border-radius: 14px;
}

/* trilha / “pill” de fundo */
#CartDrawer .sb-track{
  background: rgba(29,53,87,.08); /* royal suave baseado no #1D3557 */
}

/* ícones (tira o verde e aplica royal/dourado) */
#CartDrawer .sb-icon{
  background: rgba(29,53,87,.10);
  border: 1px solid rgba(29,53,87,.18);
  color: var(--simp-royal);
}

/* estado ativo / desbloqueado — troca verde por dourado */
#CartDrawer .sb-step.is-active .sb-icon,
#CartDrawer .sb-step.is-unlocked .sb-icon,
#CartDrawer .sb-icon.is-active{
  background: rgba(200,162,74,.18);
  border-color: rgba(200,162,74,.35);
  color: var(--simp-black);
}

/* textos */
#CartDrawer .sb-label,
#CartDrawer .sb-title,
#CartDrawer .sb-msg{
  color: var(--simp-black);
}

#CartDrawer .sb-sub,
#CartDrawer .sb-hint{
  color: rgba(17,17,17,.70);
}

/* barra de progresso (se existir) */
#CartDrawer .sb-progress,
#CartDrawer .sb-fill{
  background: var(--simp-royal) !important;
}

/* Destaque da mensagem final de benefícios desbloqueados */
#CartDrawer .sb-msg{
  font-weight: 600;              /* negrito elegante (não pesado demais) */
  color: #1D3557;                /* azul royal da Simplicité */
  margin-top: 10px;
}

/* Se quiser o emoji/símbolo um pouco mais sutil */
#CartDrawer .sb-msg span,
#CartDrawer .sb-msg svg{
  opacity: 0.9;