/* custom-overrides.css
   Criado 2026-06-09. Sobrepoe regras de custom.css sem o modificar.
   Carregado em templates/_partials/head.tpl depois de {include "_partials/stylesheets.tpl"}.

   NOTA cascata: o custom.css e injectado tarde pelo hook displayCustomCss (?444) e fica
   depois deste ficheiro no HTML. Para ganhar, usar especificidade superior (prefixar com html). */

/* === Anula o bloco v3 que criava 200-400px de area azul vazia em mobile === */
@media (max-width: 991px) {
  html body#product,
  html body.product-id,
  html body[class*='product-id-'] { padding-bottom: 0 !important; }

  html body#product #wrapper,
  html body#product .tv-main-div { padding-bottom: 0 !important; }

  html #groups_cliche .pg-step-next-wrap { margin-bottom: 0 !important; }
  html #groups_cliche .pg-bottom-nav-row { margin-bottom: 0 !important; padding-bottom: 0 !important; }
}

/* === Avancar para overlap v5: padding minimo so no wrap do botao === */
@media (max-width: 991px) {
  html #groups_cliche .pg-step-next-wrap { padding-bottom: 80px !important; }
}

/* === T12 (ER8 IT 2026-06-11): folga inferior no produto mobile p/ a barra fixa "Compra" + nav.
   Pad no .tv-main-div (fundo BRANCO), nao no body azul -> da folga sem reintroduzir a area vazia (N5).
   'html' prefixa p/ ganhar especificidade ao "overlap v5" (body#product .tv-main-div{padding-bottom:0}). === */
@media (max-width: 991px) {
  html body#product .tv-main-div { padding-bottom: 150px !important; }
}

/* === Slide de video da galeria (ER8 IT): deixar o swipe passar (video sem controlos) === */
/* (removido: video da galeria agora usa controlos YouTube, sem pointer-events:none) */

/* === Capa do produto (antes do video) preenche todo o quadrado, igual a galeria no fim === */
.product-video2 .product-main-image,
.product-video2 .product-main-image img { width: 100% !important; height: 100% !important; object-fit: cover; display: block; }

/* === X p/ fechar o video de autoplay === */
.product-video2 .tv-video-close { position:absolute; top:8px; right:8px; z-index:12; width:34px; height:34px; border-radius:50%; background:rgba(0,0,0,.55); color:#fff; border:0; font-size:22px; line-height:1; cursor:pointer; pointer-events:auto; display:flex; align-items:center; justify-content:center; }

/* === Botao 'Rivedi il video' na galeria (aparece quando as fotos mostram) === */
.product-images { position: relative; }
.product-images .tv-video-replay { position:absolute; top:10px; left:10px; z-index:8; background:rgba(0,0,0,.6); color:#fff; border:0; border-radius:18px; padding:7px 13px; font-size:13px; line-height:1; cursor:pointer; }

/* === Tirar o descritivo do modal de imagens === */
#product-modal .image-caption, #product-modal #product-description-short, #product-modal #thumbnails, #product-modal aside.thumbnails, #product-modal .arrows { display: none !important; }
#product-modal .modal-content { background: transparent !important; border: 0 !important; box-shadow: none !important; }
#product-modal .modal-body { padding: 0 !important; }
#product-modal figure, #product-modal figcaption { margin: 0 !important; }

/* === Video inicial (autoplay) deslizável: toque passa para o swipe-fechar === */
.product-video2 iframe { pointer-events: none !important; }

/* === Top-bar de promoções escondida nas páginas de produto (ganhar fold) === */
body#product #ps_topbanner_wrapper,
body.page-product #ps_topbanner_wrapper { display: none !important; }

/* === Botão scroll-to-top no azul do tema (era cinza/preto) === */
.tvbottom-to-top { background-color: rgb(24, 96, 163) !important; }
.tvbottom-to-top, .tvbottom-to-top *, .tvbottom-to-top i, .tvbottom-to-top svg { color: #fff !important; fill: #fff !important; }

/* === Menu inferior: escondido ao entrar, aparece ao fazer scroll (produto) === */
body#product .tvfooter-mobile-product-sticky-bottom { transition: transform .25s ease; }
body#product:not(.er-scrolled) .tvfooter-mobile-product-sticky-bottom { transform: translateY(120px) !important; }

/* === Barra add-to-cart desce ao fundo quando o menu inferior esconde (entry); sobe no scroll === */
body#product .tvfooter-mobile-add-to-cart { transition: bottom .25s ease; }
body#product:not(.er-scrolled) .tvfooter-mobile-add-to-cart { bottom: 0 !important; padding-bottom: env(safe-area-inset-bottom) !important; }

/* === Breadcrumb maior (era 7px -> métricas Google) === */
body#product .breadcrumbmob a, body#product .breadcrumbmob li, body#product .breadcrumbmob span, body#product .breadcrumbmob { font-size: 11px !important; }

/* === Swipe nos videos: galeria volta a pe:none (swiper desliza), intro com overlay === */
.product-video, #product-video, .product-video iframe, #product-video iframe { pointer-events: none !important; }
.product-video2 .er-vid-swipe { position:absolute; inset:0; z-index:6; background:transparent; }

/* === Botoes proprios nos videos (fullscreen + repetir), por cima do swipe === */
.er-vid-ctrls { position:absolute; top:8px; right:8px; z-index:9; display:flex; gap:6px; }
.er-vid-ctrls button { width:34px; height:34px; border-radius:50%; background:rgba(0,0,0,.55); color:#fff; border:0; font-size:18px; line-height:1; cursor:pointer; pointer-events:auto; display:flex; align-items:center; justify-content:center; }
.product-video .er-vid-ctrls { pointer-events:none; }
.product-video .er-vid-ctrls button { pointer-events:auto; }

/* ============================================================
   ER8 IT 2026-06-11 — Header mobile + add-to-cart (batch 2)
   ============================================================ */

/* === Header produto/categoria: centrar verticalmente seta-back, titulo e icons === */
#tvcms-mobile-view-header.mobile-header-2 .tvcmsmobile-header-search-logo-wrapper { align-items: stretch !important; }
#tvcms-mobile-view-header.mobile-header-2 .tvcmsmobile-header-menu,
#tvcms-mobile-view-header.mobile-header-2 .tvcmsmobile-header-search { display: flex !important; align-items: center !important; }
#tvcms-mobile-view-header.mobile-header-2 .tvcmsmobile-header-menu #btn-back,
#tvcms-mobile-view-header.mobile-header-2 .tvcmsmobile-header-menu #btn-back i { display: flex; align-items: center; line-height: 1; }
#tvcms-mobile-view-header.mobile-header-2 .tvcmsmobile-header-logo-right-wrapper { top: 0 !important; display: flex; flex-direction: column; justify-content: center; }
#tvcms-mobile-view-header.mobile-header-2 .breadcrumbmob h1 { padding-top: 0 !important; }

/* === Breadcrumb vazio (categoria de topo) nao reserva espaco -> nome fica centrado === */
#tvcms-mobile-view-header.mobile-header-2 .breadcrumbmob nav.breadcrumb:has(ol:empty) { display: none !important; }
#tvcms-mobile-view-header.mobile-header-2 .breadcrumbmob nav.breadcrumb ol:empty { display: none !important; }

/* === Add-to-cart encostado ao fundo: tambem o .tvflex-items interno (tinha top:-20px) === */
body#product:not(.er-scrolled) .tvfooter-mobile-add-to-cart .tvflex-items { top: 0 !important; }

/* === Swipe do video intro: ancora p/ o overlay absoluto (evita o salto das fotos) === */
.product-2 .tvvertical-slider { position: relative; }

/* === Categoria: nome um pouco maior, centrado, sem espaco em baixo === */
body#category #tvcms-mobile-view-header.mobile-header-2 .breadcrumbmob h1 { font-size: 15px !important; padding: 0 !important; margin: 0 !important; }
body#category #tvcms-mobile-view-header.mobile-header-2 .breadcrumbmob { display: flex; flex-direction: column; justify-content: center; }

/* ============================================================
   ER8 IT 2026-06-11 — Scroll UI (batch 3)
   ============================================================ */

/* === Scroll-top: no mobile so aparece depois de scroll down (estava sempre visivel via display:block!important) === */
@media (max-width: 1024px) {
  html .tvbottom-to-top { display: none !important; }
  html body.er-show-totop .tvbottom-to-top { display: block !important; opacity: 1 !important; }
}

/* === Menu inferior (5 icones) no HOME: esconde ao scroll down, volta ao scroll up === */
body#index .tvfooter-mobile-product-sticky-bottom { transition: transform .25s ease; }
body#index.er-nav-hide .tvfooter-mobile-product-sticky-bottom { transform: translateY(140px) !important; }

/* === Botao carrinho ao centro (menu inferior): igual ao header + badge de qtd === */
.er-center-cart {
  position: fixed; left: 50%; bottom: -36px; transform: translate(-50%, -50%);
  width: 54px; height: 54px; border-radius: 50%;
  background: linear-gradient(180deg, #1d2f6a 0%, #1860a3 100%);
  box-shadow: 0 8px 16px rgba(0,0,0,.16);
  display: flex; align-items: center; justify-content: center;
}
.er-center-cart svg { width: 26px !important; height: 26px !important; }
.er-center-cart svg path { fill: #fff !important; }
.er-center-cart .er-center-cart-count {
  position: absolute; top: 4px; right: 4px;
  min-width: 17px; height: 17px; padding: 0 4px; border-radius: 17px;
  background: red; color: #fff; font: 700 10px/17px Poppins, sans-serif;
  display: flex; align-items: center; justify-content: center; box-sizing: border-box;
}
.er-center-cart .er-center-cart-count.er-bump { animation: erCartBump .3s ease; }
@keyframes erCartBump { 0%{transform:scale(1)} 50%{transform:scale(1.45)} 100%{transform:scale(1)} }

/* ============================================================
   ER8 IT 2026-06-11 — Bullets galeria + setas configurador (batch 4)
   ============================================================ */

/* === Bullets da galeria: modernos (pill que expande) na cor do tema === */
#product-swiper::part(bullet) { width: 7px; height: 7px; background: #1860A3; opacity: .35; border-radius: 50%; transition: transform .2s ease, opacity .2s ease; }
#product-swiper::part(bullet-active) { opacity: 1; background: #1860A3; transform: scale(1.4); }
#product-swiper { --swiper-pagination-color: #1860A3; }

/* === Esconder setas ‹ › dos swipers do configurador em mobile (clicar levava ao descritivo) === */
@media (max-width: 991px) {
  #groups_cliche swiper-container::part(button-prev),
  #groups_cliche swiper-container::part(button-next) { display: none !important; }
  #groups_cliche .swiper-button-prev,
  #groups_cliche .swiper-button-next { display: none !important; }
}

/* ============================================================
   ER8 IT 2026-06-11 — Setas grupo + botao compra (batch 5)
   ============================================================ */

/* === Req1: esconder a seta (chevron) ao nivel do nome de cada grupo em mobile === */
@media (max-width: 991px) {
  #groups_cliche .angle-mobile { display: none !important; }
}

/* === Req2: setas animadas do botao verde Compra nao "caem" ao clicar (mobile) === */
@media (max-width: 991px) {
  .tvfooter-mobile-add-to-cart .btn-clichecart:active,
  .tvfooter-mobile-add-to-cart .btn-clichecart:focus,
  .tvfooter-mobile-add-to-cart .add-to-cart:active,
  .tvfooter-mobile-add-to-cart #add_to_cliche_cart:active {
    transform: none !important;
    box-shadow: none !important;
  }
  .tvfooter-mobile-add-to-cart .btn-clichecart:active .img_arrows,
  .tvfooter-mobile-add-to-cart .btn-clichecart:focus .img_arrows,
  .tvfooter-mobile-add-to-cart .btn-clichecart[disabled] .img_arrows,
  .tvfooter-mobile-add-to-cart .add-to-cart:active .img_arrows,
  .tvfooter-mobile-add-to-cart .add-to-cart[disabled] .img_arrows {
    /* manter EXACTAMENTE a posicao nativa (absolute top:0 bottom:0) — so congelar a animacao/translate
       que fazia as setas "cair" ao clicar. NAO reposicionar (bottom:0/top:auto fazia-as descer). */
    animation: none !important;
    transform: none !important;
    transition: none !important;
  }
  /* o carrinho tambem nao se mexe ao clicar (mobile estatico) */
  .tvfooter-mobile-add-to-cart .btn-clichecart:active .img_button,
  .tvfooter-mobile-add-to-cart .btn-clichecart:focus .img_button,
  .tvfooter-mobile-add-to-cart .add-to-cart:active .img_button {
    animation: none !important;
    transform: none !important;
    transition: none !important;
  }
  /* corte azul/verde LIMPO (como em tablet/desktop): a peca azul com a diagonal (clip-path)
     era so 47px enquanto o verde tem 61px -> sobrava um "quadrado verde" por baixo da diagonal.
     Forcar a peca da diagonal a ocupar a altura toda da barra -> a diagonal corre de cima a baixo. */
  body#product .tvfooter-mobile-add-to-cart .guide_quantity.col-xs-5{
    height:100% !important; min-height:61px !important; align-self:stretch !important;
  }
}

/* ============================================================
   ER8 IT 2026-06-11 — Configurador: sem botao Avanti, auto-avanca (batch 6)
   ============================================================ */
@media (max-width: 991px) {
  /* Req C: esconder botao "Avanti" (passa a auto-avancar ao selecionar) */
  #groups_cliche .pg-step-next-wrap,
  #groups_cliche .pg-step-next-btn { display: none !important; }
  /* Margem de seguranca CONSISTENTE: cards -> barra qtd -> cards de info (28px) */
  #groups_cliche { min-height: auto !important; }
  #groups_cliche .pg-bottom-nav-row { margin-top: 52px !important; }
  #groups_cliche #quantity_wanted_mobile { padding-top: 0 !important; }
  #showhidden { margin-top: 26px !important; }
}
/* Req C: check visual na opcao selecionada */
#groups_cliche .er-opt-check { position: absolute; top: 6px; right: 6px; z-index: 6; width: 24px; height: 24px; border-radius: 50%; background: #248823; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 14px; line-height: 1; box-shadow: 0 2px 5px rgba(0,0,0,.25); animation: erChkPop .25s ease; }
@keyframes erChkPop { 0% { transform: scale(0); } 70% { transform: scale(1.25); } 100% { transform: scale(1); } }

/* ============================================================
   ER8 IT 2026-06-11 — Configurador header off + galeria fs (batch 8)
   ============================================================ */
@media (max-width: 991px) {
  /* Esconder titulo do grupo + a linha (info duplicada nas pills em cima) */
  #groups_cliche .tab-content .tab-pane [role='tab'] { display: none !important; }
  /* Cards comecam colados ao inicio (linear, como a barra de baixo) */
  #groups_cliche .combs { padding-left: 0 !important; }
}
/* Galeria: sem botao fullscreen no video da galeria (mantem so no intro) */
.product-video .er-vid-ctrls { display: none !important; }

/* === Resumo da selecao no ultimo grupo === */
.er-recap { margin: 4px 10px 0; padding: 12px 14px; background: linear-gradient(160deg,#1d2f6a,#1860a3); border-radius: 14px; color: #fff; box-shadow: 0 6px 16px rgba(24,96,163,.25); }
.er-recap-t { font: 700 12px Poppins, sans-serif; opacity: .9; margin-bottom: 8px; }
.er-recap-row { display: flex; gap: 14px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.er-recap-i { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 64px; flex: 0 0 auto; }
.er-recap-i img { width: 46px; height: 46px; object-fit: cover; border-radius: 10px; background: #fff; }
.er-recap-i em { font: 600 10px Poppins, sans-serif; font-style: normal; text-align: center; line-height: 1.2; opacity: .95; }

/* ============================================================
   ER8 IT — Barra de quantidade V2 (recomendado/popular) batch 9
   ============================================================ */
/* esconder slider antigo: a V2 toma o lugar (mantem #ex13/slider1 funcional p/ preco) */
#quantity_wanted_mobile .slider,
#quantity_wanted_mobile .tooltip,
#quantity_wanted_mobile #quantity_table_wanted_cliche,
#quantity_wanted_mobile .slider, #quantity_wanted_mobile .tooltip { display: none !important; }

.qv2{ background:linear-gradient(160deg,#13294f,#0b1730); border:1px solid #1d3358; border-radius:18px; padding:16px 16px 18px; margin:0 10px; color:#fff; box-shadow:0 8px 22px rgba(0,0,0,.25); }
.qv2-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.qv2-q{ display:flex; align-items:baseline; gap:6px; }
.qv2-q b{ font:800 40px/.9 Poppins,sans-serif; background:linear-gradient(90deg,#fff,#7fdbff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.qv2-q span{ font:600 12px Poppins,sans-serif; color:#9fb6d4; }
.qv2-badge{ font:800 15px Poppins,sans-serif; color:#7f97ba; background:rgba(255,255,255,.05); border:1px solid #2a4a72; padding:6px 12px; border-radius:13px; white-space:nowrap; }
.qv2-badge.ok{ color:#39d98a; background:rgba(57,217,138,.12); border-color:rgba(57,217,138,.5); box-shadow:0 0 14px rgba(57,217,138,.2); }
.qv2-track{ position:relative; height:14px; border-radius:11px; background:#0a1428; box-shadow:inset 0 2px 7px rgba(0,0,0,.6); overflow:hidden; }
.qv2-fill{ position:absolute; inset:0 auto 0 0; width:0; border-radius:11px; background:linear-gradient(90deg,#1860A3,#27c4ff); box-shadow:0 0 16px rgba(39,196,255,.5); }
.qv2-fill:after{ content:""; position:absolute; top:0; left:0; width:55px; height:100%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent); animation:qv2shine 2.2s ease-in-out infinite; }
@keyframes qv2shine{0%{transform:translateX(-55px)}60%,100%{transform:translateX(420px)}}
.qv2-range{ -webkit-appearance:none; appearance:none; width:100%; height:34px; background:transparent; margin:-26px 0 0; position:relative; z-index:5; }
.qv2-range::-webkit-slider-thumb{ -webkit-appearance:none; width:30px; height:30px; border-radius:50%; background:#fff; border:0; box-shadow:0 0 0 6px rgba(39,196,255,.22),0 3px 10px rgba(0,0,0,.5); }
.qv2-chips{ display:flex; gap:7px; margin-top:14px; }
.qv2-chip{ flex:1; padding:10px 0; border:1px solid #244067; background:rgba(39,196,255,.06); color:#bcd4ee; border-radius:11px; font:700 12.5px Poppins,sans-serif; position:relative; }
.qv2-chip.on{ background:linear-gradient(90deg,#1860A3,#27c4ff); border-color:transparent; color:#06203a; }
.qv2-chip .qv2-pop{ position:absolute; top:-9px; left:50%; transform:translateX(-50%); background:#ffd166; color:#3a2a00; font:800 8px Poppins,sans-serif; padding:2px 6px; border-radius:8px; }
.qv2-social{ margin-top:13px; font:500 12px Poppins,sans-serif; color:#bcd4ee; display:flex; align-items:center; gap:9px; }
.qv2-social b{ color:#fff; }
.qv2-av{ display:flex; }
.qv2-av i{ width:20px; height:20px; border-radius:50%; border:2px solid #13294f; margin-left:-7px; background:linear-gradient(135deg,#3b9dff,#27c4ff); display:block; }

/* === V2 ajustes: largura segura + esconder bolha "20" antiga === */
#er-qtyv2.qv2 { box-sizing: border-box; width: calc(100vw - 20px); max-width: calc(100vw - 20px); margin: 0 10px; overflow: hidden; }
#er-qtyv2 .qv2-top { gap: 8px; }
#er-qtyv2 .qv2-q { flex: 0 0 auto; }
#er-qtyv2 .qv2-badge { font-size: 12.5px; padding: 6px 10px; flex: 0 1 auto; min-width: 0; text-align: center; line-height: 1.1; }
#er-qtyv2 .qv2-chips { flex-wrap: nowrap; }

/* === V2 fix2: contentor a 100vw, card preenche; bolha antiga fora === */
#groups_cliche #quantity_wanted_mobile { box-sizing: border-box; width: 100% !important; max-width: 100vw !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; overflow: hidden; }
#er-qtyv2.qv2 { width: auto !important; max-width: none !important; margin: 0 10px !important; box-sizing: border-box; }

/* === V2 fix3: largura travada + chips encolhem + esconder bloco antigo todo === */
#er-qtyv2.qv2 { width: calc(100vw - 20px) !important; max-width: calc(100vw - 20px) !important; margin: 0 10px !important; box-sizing: border-box !important; overflow: hidden !important; }
#er-qtyv2 .qv2-chip { flex: 1 1 0 !important; min-width: 0 !important; }
@media (max-width: 991px) {
  body#product #configurator_preview_buttons { display: none !important; }
  body#product .slider.slider-horizontal, body#product .tooltip.tooltip-main { display: none !important; }
}

/* === V2 tight: badge compacto + top sem forcar largura === */
#er-qtyv2 .qv2-top { flex-wrap: nowrap; }
#er-qtyv2 .qv2-badge { font-size: 13px !important; padding: 6px 11px !important; white-space: nowrap; flex: 0 0 auto; }
#er-qtyv2 .qv2-q b { font-size: 38px; }


/* === V2: usar % do contentor (vw nao fiavel); contentor travado a coluna === */
#groups_cliche #quantity_wanted_mobile { width: auto !important; max-width: 100% !important; padding: 0 10px !important; box-sizing: border-box !important; overflow: hidden !important; }
#er-qtyv2.qv2 { width: 100% !important; max-width: 100% !important; margin: 0 !important; box-sizing: border-box !important; }

/* ============================================================
   ER8 IT — V2 re-skin: fundir com o design atual (azul do tema) + fluido
   ============================================================ */
#er-qtyv2.qv2 {
  background: linear-gradient(160deg, #1d2f6a 0%, #1860A3 100%) !important;
  border: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 16px rgba(24,96,163,.25) !important;
  padding: clamp(12px,4vw,18px) clamp(12px,4vw,16px) !important;
}
#er-qtyv2 .qv2-q b { background: none !important; -webkit-text-fill-color: #fff !important; color: #fff !important; font-size: clamp(30px,11vw,42px) !important; }
#er-qtyv2 .qv2-q span { color: rgba(255,255,255,.8) !important; }
#er-qtyv2 .qv2-badge { background: rgba(255,255,255,.12) !important; border: 1px solid rgba(255,255,255,.35) !important; color: #fff !important; font-size: clamp(12px,3.4vw,14px) !important; box-shadow: none !important; }
#er-qtyv2 .qv2-badge.ok { background: #248823 !important; border-color: #248823 !important; color: #fff !important; }
#er-qtyv2 .qv2-track { background: rgba(0,0,0,.26) !important; box-shadow: inset 0 2px 6px rgba(0,0,0,.35) !important; }
#er-qtyv2 .qv2-fill { background: #fff !important; box-shadow: 0 0 10px rgba(255,255,255,.4) !important; }
#er-qtyv2 .qv2-fill:after { background: linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent) !important; }
#er-qtyv2 .qv2-range::-webkit-slider-thumb { background: #fff !important; box-shadow: 0 0 0 5px rgba(255,255,255,.25), 0 3px 8px rgba(0,0,0,.4) !important; }
#er-qtyv2 .qv2-chip { background: rgba(255,255,255,.1) !important; border: 1px solid rgba(255,255,255,.3) !important; color: #fff !important; font-size: clamp(12px,3.4vw,13px) !important; padding: clamp(8px,2.6vw,10px) 0 !important; }
#er-qtyv2 .qv2-chip.on { background: #fff !important; border-color: #fff !important; color: #1860A3 !important; }
#er-qtyv2 .qv2-chip .qv2-pop { background: #FFD741 !important; color: #1d2f6a !important; }
#er-qtyv2 .qv2-social { color: rgba(255,255,255,.9) !important; font-size: clamp(11px,3.2vw,12px) !important; }
#er-qtyv2 .qv2-social b { color: #fff !important; }
#er-qtyv2 .qv2-av i { background: #fff !important; border-color: #1860A3 !important; }

/* === Ajuste de espacamento: cards -> V2 (mais perto), V2 -> info cards (folga ligeiramente maior) === */
@media (max-width: 991px) {
  #groups_cliche .pg-bottom-nav-row { margin-top: 6px !important; }
  #showhidden { margin-top: 22px !important; }
}

@media (max-width: 991px) { #showhidden { margin-top: 27px !important; } }

/* === Colapsar cards do ultimo grupo apos selecao (qtty sobe ao sitio dos cards) === */
#groups_cliche .combs { transition: max-height .4s ease, opacity .3s ease, margin .3s ease, padding .3s ease; }
#groups_cliche .combs.er-collapsed { max-height: 0 !important; opacity: 0 !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; }

/* ============================================================
   ER8 IT — Barra de quantidade ESGUIA (#10) batch 12
   ============================================================ */
#er-qtyv2.qv2-slim { padding: clamp(10px,3vw,14px) clamp(11px,3.5vw,14px) !important; }
#er-qtyv2.qv2-slim .qv2-row { display:flex; align-items:center; gap:12px; }
#er-qtyv2.qv2-slim .qv2-q { display:flex; align-items:baseline; gap:4px; flex:0 0 auto; }
#er-qtyv2.qv2-slim .qv2-q b { font:800 clamp(24px,8vw,30px)/.9 Poppins,sans-serif; -webkit-text-fill-color:#fff; color:#fff; background:none; }
#er-qtyv2.qv2-slim .qv2-q span { font:600 11px Poppins,sans-serif; color:rgba(255,255,255,.75); }
#er-qtyv2.qv2-slim .qv2-range { flex:1; -webkit-appearance:none; appearance:none; height:6px; border-radius:6px; background:rgba(0,0,0,.28); outline:none; margin:0; }
#er-qtyv2.qv2-slim .qv2-range::-webkit-slider-thumb { -webkit-appearance:none; width:22px; height:22px; border-radius:50%; background:#fff; border:0; box-shadow:0 1px 5px rgba(0,0,0,.45); }
#er-qtyv2.qv2-slim .qv2-badge { flex:0 0 auto; font:800 12px Poppins,sans-serif; color:#fff; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.35); padding:5px 9px; border-radius:11px; white-space:nowrap; box-shadow:none; }
#er-qtyv2.qv2-slim .qv2-badge.ok { background:#248823; border-color:#248823; }
#er-qtyv2.qv2-slim .qv2-ticks { display:flex; gap:6px; margin-top:15px; }
#er-qtyv2.qv2-slim .qv2-tick { flex:1; min-width:0; position:relative; border:1px solid rgba(255,255,255,.3); background:rgba(255,255,255,.1); color:#fff; border-radius:9px; padding:7px 0; font:700 12.5px Poppins,sans-serif; }
#er-qtyv2.qv2-slim .qv2-tick.on { background:#fff; border-color:#fff; color:#1860A3; }
#er-qtyv2.qv2-slim .qv2-tick .qv2-bs { position:absolute; top:-9px; left:50%; transform:translateX(-50%); background:#FFD741; color:#1d2f6a; font:800 7.5px Poppins,sans-serif; padding:1px 6px; border-radius:6px; white-space:nowrap; letter-spacing:.2px; }
#er-qtyv2.qv2-slim .qv2-custom { flex:1.2; min-width:0; display:flex; align-items:center; gap:4px; border:1px dashed rgba(255,255,255,.6); background:rgba(255,255,255,.06); border-radius:9px; padding:0 8px; }
#er-qtyv2.qv2-slim .qv2-custom.on { background:#fff; border-style:solid; border-color:#fff; }
#er-qtyv2.qv2-slim .qv2-custom.on .qv2-cin, #er-qtyv2.qv2-slim .qv2-custom.on .qv2-pen { color:#1860A3; }
#er-qtyv2.qv2-slim .qv2-pen { color:#fff; font-size:13px; opacity:.92; flex:0 0 auto; }
#er-qtyv2.qv2-slim .qv2-cin { width:100%; min-width:0; border:0; background:transparent; color:#fff; font:700 12.5px Poppins,sans-serif; padding:7px 0; outline:none; -moz-appearance:textfield; }
#er-qtyv2.qv2-slim .qv2-cin::-webkit-outer-spin-button, #er-qtyv2.qv2-slim .qv2-cin::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
#er-qtyv2.qv2-slim .qv2-cin::placeholder { color:rgba(255,255,255,.78); font-weight:600; }
#er-qtyv2.qv2-slim .qv2-hint { margin-top:9px; font:600 11px Poppins,sans-serif; color:rgba(255,255,255,.8); display:flex; align-items:center; gap:5px; }
#er-qtyv2.qv2-slim .qv2-hint .qv2-pen2 { color:#FFD741; font-size:13px; }
/* animacao UX: chama atencao para a quantidade livre */
#er-qtyv2.qv2-slim .qv2-custom { animation: qv2pulse 1.7s ease-in-out 2.2s 3; }
#er-qtyv2.qv2-slim.qv2-editing .qv2-custom { animation: none; }
@keyframes qv2pulse { 0%,100%{ box-shadow:0 0 0 0 rgba(255,215,65,0); } 50%{ box-shadow:0 0 0 3px rgba(255,215,65,.6); } }
#er-qtyv2.qv2-slim .qv2-hint { animation: qv2hint 2.4s ease-in-out 2.2s 3; }
@keyframes qv2hint { 0%,100%{ opacity:.6; } 50%{ opacity:1; } }

/* === Reduzir altura: pills dos grupos + top bar (subir a barra de qtd p/ caber no fold) === */
@media (max-width: 991px) {
  #groups_cliche #combsclichemobile { padding-top: 0 !important; padding-bottom: 0 !important; }
  #groups_cliche #combsclichemobile .nav-link { padding-top: 5px !important; padding-bottom: 5px !important; }
  #groups_cliche #combsclichemobile .nav-item { padding-top: 0 !important; padding-bottom: 0 !important; }
  #tvcms-mobile-view-header.mobile-header-2 .tvcmsmobile-header-menu { padding-top: 8px !important; padding-bottom: 8px !important; }
}

/* === D: botao Adicionar + colapso + resumo em cards === */
#er-qtyv2.qv2-slim .qv2-badge.qv2-add { background:#248823 !important; border-color:#248823 !important; color:#fff !important; cursor:pointer; padding:6px 13px !important; box-shadow:0 3px 10px rgba(36,136,35,.35) !important; animation: qv2addpop .3s ease; }
@keyframes qv2addpop { 0%{ transform:scale(.85); } 60%{ transform:scale(1.08); } 100%{ transform:scale(1); } }
#er-qtyv2.qv2-collapsed { max-height:0 !important; padding-top:0 !important; padding-bottom:0 !important; margin-top:0 !important; opacity:0 !important; overflow:hidden !important; transition: all .35s ease !important; }
#er-qtyv2 { transition: max-height .35s ease, opacity .3s ease; }

.er-recap2 { margin:8px 10px 0; }
.er-recap2-h { display:flex; align-items:center; justify-content:space-between; font:700 13px Poppins,sans-serif; color:#248823; margin-bottom:9px; }
.er-recap2-edit { border:1px solid #1860A3; background:#fff; color:#1860A3; border-radius:9px; font:700 11px Poppins,sans-serif; padding:5px 12px; }
.er-recap2-grid { display:flex; gap:8px; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:2px; }
.er-recap2-card { flex:0 0 auto; width:84px; background:linear-gradient(160deg,#1d2f6a,#1860A3); border-radius:12px; padding:8px; color:#fff; text-align:center; box-shadow:0 4px 12px rgba(24,96,163,.2); }
.er-recap2-card img { width:100%; height:60px; object-fit:cover; border-radius:8px; background:#fff; display:block; }
.er-recap2-card span { display:block; font:600 9.5px Poppins,sans-serif; margin-top:5px; line-height:1.2; }
.er-recap2-card.er-recap2-qty { display:flex; flex-direction:column; align-items:center; justify-content:center; background:#248823; }
.er-recap2-card.er-recap2-qty b { font:800 26px/.9 Poppins,sans-serif; }
.er-recap2-card.er-recap2-qty span { font-size:10px; opacity:.9; margin-top:3px; }

/* alert-light (pre-visualizacao) escondido quando vazio; modulo mostra-o inline na seleccao */
#tvcms-mobile-view-header .alert-light { opacity: 0; }

/* fechar gap header(51)->galeria: clearance era 59 (mobile, produto) */
body#product #content-wrapper { margin-top: 21px !important; }
/* ============================================================
   ER8 IT — refresh estetico produto: gradiente espalhado + nomes 2 linhas
   ============================================================ */
/* gradiente do tema em todos os cards/barras azuis do produto (como a barra de qtd) */
body#product #showhidden .card,
body#product .tvfooter-mobile-add-to-cart .tvflex-items { background: linear-gradient(160deg,#1d2f6a 0%,#1860A3 100%) !important; }
/* nome das opcoes: maximo 2 linhas (card mais concentrado) */
#groups_cliche .ng-txtproduct span { display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; line-height:1.2; }
/* revelar nome completo com animacao: desktop :hover (restaura o do tema, que o override de cima tapava por especificidade) + mobile/tablet ao clicar (.er-name-open via JS) */
#groups_cliche .ng-txtproduct span, #combsclichemobile .ng-txtproduct span { transition:max-height .3s ease !important; max-height:calc(2.4em + 8px); }
#groups_cliche .ng-txtproduct span:hover, #combsclichemobile .ng-txtproduct span:hover,
#groups_cliche .ng-txtproduct span.er-name-open, #combsclichemobile .ng-txtproduct span.er-name-open { -webkit-line-clamp:unset !important; line-clamp:unset !important; max-height:300px !important; overflow:visible !important; }

/* === Resumo final: produto principal destacado + divisoria === */
.er-recap2-card.er-recap2-main { border: 2px solid #FFD741 !important; box-shadow: 0 4px 14px rgba(24,96,163,.3); }
.er-recap2-div { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; align-self: stretch; padding: 0 2px; }
.er-recap2-div i { font-style: normal; color: #1860A3; font-weight: 800; font-size: 20px; opacity: .55; }

/* ============================================================
   ER8 qty bar TAP — consola full-width, edit no pill, barra infinita ate 25000
   ============================================================ */
/* ===== barra de quantidade: TODAS as resolucoes (responsiva) ===== */
/* o host do modulo corta o thumb a direita (overflow:hidden) -> destapar + barra por cima de tudo */
/* padding-bottom: respiro simetrico ao topo, antes dos cards Caratteristiche/Recensioni */
#groups_cliche #quantity_wanted_mobile{ overflow:visible !important; padding-bottom:12px !important; }
#er-qtyv2.qt{ position:relative; z-index:5; width:100%; max-width:620px; margin-left:auto; margin-right:auto; transition:margin-top .3s ease; background:transparent !important; border:0 !important; box-shadow:none !important;
  color:#13294f !important; padding:6px 0 2px !important; overflow:visible !important;
  font-family:Poppins,-apple-system,"Segoe UI",Helvetica,Arial,sans-serif; }
#er-qtyv2.qt *{ box-sizing:border-box; }

/* consola pill central (com pencil entre 'un' e o badge) */
#er-qtyv2.qt .qt-console{ display:flex; justify-content:center; position:relative; z-index:41; }
#er-qtyv2.qt .qt-pill{ display:inline-flex; align-items:center; gap:8px; border:1px solid #dbe2ee; border-radius:16px;
  padding:9px 9px 9px 16px; box-shadow:0 6px 18px -10px rgba(19,41,79,.25); background:#fff; }
#er-qtyv2.qt .qt-num{ font:800 25px/.9 Poppins,sans-serif !important; color:#1d2f6a !important; -webkit-text-fill-color:#1d2f6a !important;
  background:none !important; letter-spacing:-1px; cursor:text; }
#er-qtyv2.qt .qt-numedit{ width:3.8em; border:0; outline:0; background:#fff; border-bottom:2px solid #1860A3; text-align:center;
  font:800 25px/.9 Poppins,sans-serif !important; color:#1d2f6a !important; -webkit-text-fill-color:#1d2f6a !important; letter-spacing:-1px; -moz-appearance:textfield; }
#er-qtyv2.qt .qt-numedit::-webkit-outer-spin-button,#er-qtyv2.qt .qt-numedit::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
#er-qtyv2.qt .qt-un{ font:600 12px Poppins,sans-serif !important; color:#7d89a6 !important; -webkit-text-fill-color:#7d89a6 !important; margin-left:-1px; }
#er-qtyv2.qt .qt-pen{ display:inline-flex; align-items:center; justify-content:center; width:27px; height:27px; border:1px solid #dbe2ee;
  background:#f6f8fc; color:#1860A3; border-radius:9px; font-size:13px; cursor:pointer; padding:0; transition:.15s; }
#er-qtyv2.qt .qt-pen:hover{ background:#1860A3; color:#fff; border-color:#1860A3; }
#er-qtyv2.qt .qt-pen:active{ transform:scale(.92); }
#er-qtyv2.qt .qt-badge{ font:800 11px Poppins,sans-serif !important; color:#7d89a6 !important; -webkit-text-fill-color:#7d89a6 !important;
  background:#f1f4f9 !important; border:1px solid #dbe2ee !important; padding:7px 10px !important; border-radius:11px !important; white-space:nowrap; box-shadow:none !important;
  cursor:pointer; transition:filter .15s,transform .1s; }
#er-qtyv2.qt .qt-badge:hover{ filter:brightness(.96); }
#er-qtyv2.qt .qt-badge.ok:hover{ filter:brightness(1.08); }
#er-qtyv2.qt .qt-badge:active{ transform:scale(.95); }
#er-qtyv2.qt .qt-badge.ok{ color:#fff !important; -webkit-text-fill-color:#fff !important; background:#1860A3 !important; border-color:#1860A3 !important; }

/* barra full-width, infinita a direita, por cima de tudo */
#er-qtyv2.qt .qt-bar{ position:relative; z-index:42; height:9px; margin:24px 6px 0; padding-bottom:34px; touch-action:none; cursor:pointer; }
#er-qtyv2.qt .qt-track{ position:relative; height:9px; border-radius:9px; background:#e9eef6; overflow:hidden; }
/* fade "infinito" so quando a barra nao tem max definido (sem tiers) */
#er-qtyv2.qt .qt-bar.qt-inf .qt-track{ border-radius:9px 3px 3px 9px;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 88%,transparent 100%); mask-image:linear-gradient(90deg,#000 0%,#000 88%,transparent 100%); }
#er-qtyv2.qt .qt-track::after{ content:""; position:absolute; inset:0; z-index:0; opacity:.85;
  background-image:repeating-linear-gradient(115deg, rgba(24,96,163,.16) 0 2px, transparent 2px 11px); background-size:11px 100%; animation:qtflow 1s linear infinite; }
@keyframes qtflow{ to{ background-position:11px 0; } }
#er-qtyv2.qt .qt-fill{ position:absolute; left:0; top:0; bottom:0; border-radius:9px; background:linear-gradient(90deg,#1d2f6a,#1f78c8);
  width:6%; transition:width .12s ease; z-index:1; overflow:hidden; }
#er-qtyv2.qt .qt-fill::after{ content:""; position:absolute; inset:0;
  background-image:repeating-linear-gradient(115deg, rgba(255,255,255,.28) 0 5px, rgba(255,255,255,0) 5px 16px); background-size:16px 100%; animation:qtbelt .7s linear infinite; }
@keyframes qtbelt{ to{ background-position:16px 0; } }

/* bullets */
#er-qtyv2.qt .qt-mk{ position:absolute; top:4.5px; transform:translate(-50%,-50%); z-index:2; cursor:pointer; }
#er-qtyv2.qt .qt-dot{ position:relative; display:block; width:var(--b,16px); height:var(--b,16px); border-radius:50%; background:#fff;
  border:2px solid #aab3c6; box-shadow:0 2px 5px rgba(19,41,79,.22); transition:transform .28s cubic-bezier(.34,1.56,.64,1),border-color .2s; }
#er-qtyv2.qt .qt-mk.passed .qt-dot{ border-color:#1860A3; transform:scale(1.16); }
#er-qtyv2.qt .qt-mk.passed .qt-dot::after{ content:""; position:absolute; left:50%; top:50%; width:5px; height:9px; border:solid #1860A3;
  border-width:0 2.2px 2.2px 0; transform:translate(-50%,-60%) rotate(40deg); }
#er-qtyv2.qt .qt-mk.bs .qt-dot{ border-color:#248823; box-shadow:0 2px 7px rgba(36,136,35,.45); }
#er-qtyv2.qt .qt-mk.bs .qt-dot::before{ content:""; position:absolute; left:50%; top:50%; width:100%; height:100%; border-radius:50%; transform:translate(-50%,-50%); animation:qtgold 1.8s ease-out infinite; }
@keyframes qtgold{ 0%{box-shadow:0 0 0 0 rgba(36,136,35,.6)} 70%{box-shadow:0 0 0 9px rgba(36,136,35,0)} 100%{box-shadow:0 0 0 0 rgba(36,136,35,0)} }
#er-qtyv2.qt .qt-mk.bs.passed .qt-dot::after{ border-color:#248823; }
#er-qtyv2.qt .qt-cl{ position:absolute; top:24px; left:50%; transform:translateX(-50%); font:700 12px Poppins,sans-serif; color:#7d89a6; white-space:nowrap; }
#er-qtyv2.qt .qt-mk.passed .qt-cl{ color:#1860A3; }
#er-qtyv2.qt .qt-mk.bs .qt-cl{ color:#248823; }
#er-qtyv2.qt .qt-bs-tag{ position:absolute; top:-19px; left:50%; transform:translateX(-50%); font:800 7.5px Poppins,sans-serif; letter-spacing:.3px; text-transform:uppercase; color:#248823; white-space:nowrap; }

/* thumb (sempre por cima e nunca cortado) */
#er-qtyv2.qt .qt-thumb{ position:absolute; top:4.5px; left:6%; transform:translate(-50%,-50%); border-radius:50%;
  background:linear-gradient(90deg,#1d2f6a,#1f78c8); box-shadow:0 4px 12px rgba(24,96,163,.5),0 0 0 4px #fff,0 0 0 5px rgba(24,96,163,.22);
  display:flex; align-items:center; justify-content:center; z-index:9; width:32px; height:32px; transition:width .18s,height .18s; cursor:grab; }
/* thumb dourado (gamificado) na faixa do best-seller */
#er-qtyv2.qt .qt-thumb.qt-gold{ background:linear-gradient(120deg,#248823,#3fbf52) !important;
  animation:qtgoldglow 1.1s ease-in-out infinite; }
@keyframes qtgoldglow{
  0%,100%{ box-shadow:0 4px 12px rgba(36,136,35,.5),0 0 0 4px #fff,0 0 0 5px rgba(36,136,35,.3),0 0 10px 2px rgba(63,191,82,.45); }
  50%{ box-shadow:0 4px 14px rgba(36,136,35,.6),0 0 0 4px #fff,0 0 0 6px rgba(36,136,35,.5),0 0 22px 7px rgba(63,191,82,.8); }
}
#er-qtyv2.qt .qt-thumb.qt-pop{ animation:qtgoldglow 1.1s ease-in-out infinite, qtpop .42s cubic-bezier(.34,1.6,.5,1); }
@keyframes qtpop{ 0%{transform:translate(-50%,-50%) scale(1);} 42%{transform:translate(-50%,-50%) scale(1.24);} 100%{transform:translate(-50%,-50%) scale(1);} }
/* TURBO ao passar os 100un: a barra relampeja dourado e volta ao azul + pop no thumb */
#er-qtyv2.qt .qt-fill.qt-turbo{ animation:qtturbo .62s ease-out; }
@keyframes qtturbo{
  0%{ background:linear-gradient(90deg,#248823,#3fbf52); box-shadow:0 0 18px 4px rgba(63,191,82,.8); }
  70%{ background:linear-gradient(90deg,#248823,#3fbf52); box-shadow:0 0 10px 2px rgba(63,191,82,.4); }
  100%{ background:linear-gradient(90deg,#1d2f6a,#1f78c8); box-shadow:none; }
}
#er-qtyv2.qt .qt-thumb.qt-tpop{ animation:qttpop .46s cubic-bezier(.34,1.6,.5,1); }
@keyframes qttpop{ 0%{transform:translate(-50%,-50%) scale(1);} 40%{transform:translate(-50%,-50%) scale(1.22);} 100%{transform:translate(-50%,-50%) scale(1);} }
/* RELAMPAGO dourado em TODA a barra ao passar cada checkpoint (100/200/500/1000/5000) */
#er-qtyv2.qt .qt-flash{ position:absolute; left:0; right:0; top:0; height:9px; border-radius:9px; z-index:1; pointer-events:none; opacity:0; overflow:hidden; }
#er-qtyv2.qt .qt-bar.qt-inf .qt-flash{ border-radius:9px 3px 3px 9px;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 88%,transparent 100%); mask-image:linear-gradient(90deg,#000 0%,#000 88%,transparent 100%); }
#er-qtyv2.qt .qt-flash.go{ animation:qtflash .6s ease-out; }
@keyframes qtflash{ 0%{ opacity:0; background:linear-gradient(90deg,#3fbf52,#248823); box-shadow:0 0 16px 4px rgba(63,191,82,.85); } 22%{ opacity:1; } 100%{ opacity:0; background:linear-gradient(90deg,#3fbf52,#248823); } }
#er-qtyv2.qt .qt-flash::after{ content:""; position:absolute; top:0; bottom:0; left:0; width:45%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent); transform:translateX(-160%); }
#er-qtyv2.qt .qt-flash.go::after{ animation:qtsweep .6s ease-out; }
@keyframes qtsweep{ 0%{ transform:translateX(-160%); } 100%{ transform:translateX(330%); } }
/* variante EPICA (5000+): roxo/magenta */
#er-qtyv2.qt .qt-flash.epic.go{ animation:qtflashE .66s ease-out; }
@keyframes qtflashE{ 0%{ opacity:0; background:linear-gradient(90deg,#c084fc,#a855f7,#ec4899); box-shadow:0 0 24px 7px rgba(168,85,247,.9); } 20%{ opacity:1; } 100%{ opacity:0; background:linear-gradient(90deg,#c084fc,#ec4899); } }
/* RELAMPAGO dentro do bullet na transicao de icon (dourado; epico p/ mega) */
#er-qtyv2.qt .qt-thumb::after{ content:""; position:absolute; inset:-2px; border-radius:50%; pointer-events:none; opacity:0; z-index:0;
  background:radial-gradient(circle, rgba(214,245,214,.95), rgba(63,191,82,.5) 45%, transparent 70%); }
#er-qtyv2.qt .qt-thumb.qt-iepic::after{ background:radial-gradient(circle, rgba(244,204,255,.97), rgba(168,85,247,.62) 45%, transparent 72%); }
#er-qtyv2.qt .qt-thumb.qt-iflash::after{ animation:qtiflash .52s ease-out; }
@keyframes qtiflash{ 0%{ opacity:0; transform:scale(.25); } 28%{ opacity:1; } 100%{ opacity:0; transform:scale(1.18); } }
/* === fim bloco da barra de quantidade === */

/* ============================================================
   Gradiente da marca em barras/menus (todas as resolucoes)
   linear-gradient(160deg,#1d2f6a,#1860A3) — como os cards Caratteristiche/Recensioni
   ============================================================ */
#tvcms-mobile-view-header{ background:linear-gradient(160deg,#1d2f6a,#1860A3) !important; }
/* barra inferior de compra: deixar o azul solido original (varios elementos, gradiente nao fica bem) */
#combsclichemobile .nav.nav-pills{ background:linear-gradient(160deg,#1d2f6a,#1860A3) !important; border-radius:0 !important; padding:6px !important; }
/* cards Caratteristiche/Recensioni/Descrizione: gradiente em portrait (#showhidden2mobile/#cardsmobile) E landscape (#showhidden) */
body#product #showhidden .card,
body#product #showhidden2 .card,
body#product #showhidden2mobile .card,
body#product #cardsmobile .card{ background:linear-gradient(160deg,#1d2f6a,#1f78c8) !important; }
/* nome + preco dos cards de opcao (combinacoes): gradiente em vez de azul solido */
/* preco: so o <p> arredondado leva o gradiente; o container .ng-price (quadrado) fica transparente */
#groups_cliche .ng-price, #combsclichemobile .ng-price{ background:transparent !important; }
#groups_cliche .ng-price p, #combsclichemobile .ng-price p,
#groups_cliche .ng-txtproduct .text-center, #combsclichemobile .ng-txtproduct .text-center,
#groups_cliche .ng-txtproduct span, #combsclichemobile .ng-txtproduct span{ background:linear-gradient(160deg,#1d2f6a,#1f78c8) !important; }
/* botao scroll-to-top: mesmo gradiente */
.tvbottom-to-top, .scrollTop{ background:linear-gradient(160deg,#1d2f6a,#1f78c8) !important; }
/* remover o botao de fullscreen (Schermo intero) do video inicial */
.er-vid-ctrls, .er-vid-fs{ display:none !important; }
/* remover a barra de DRAG nativa da quantidade (slider bootstrap), mantendo o 20 + */
.product-quantity .slider, #quantity_table_wanted_cliche .slider, .buttons_container .slider,
.product-quantity .tooltip, #quantity_table_wanted_cliche .tooltip{ display:none !important; }
/* remover a caixa fantasma da quantidade (input #quantity_wanted que andava com o slider, com sombra) */
.product-quantity #quantity_wanted, #quantity_table_wanted_cliche #quantity_wanted{ display:none !important; }
#er-qtyv2.qt .qt-ic{ position:relative; z-index:1; width:64%; height:64%; display:flex; align-items:center; justify-content:center; }
#er-qtyv2.qt .qt-ic svg{ width:100%; height:100%; overflow:visible; }
@keyframes qtdrop{ 0%{transform:translateY(-15px);opacity:0} 65%{transform:translateY(1.5px);opacity:1} 100%{transform:translateY(0)} }
#er-qtyv2.qt .qt-ic.go .b1{ animation:qtdrop .36s cubic-bezier(.3,1.4,.5,1) both; }
#er-qtyv2.qt .qt-ic.go .b2{ animation:qtdrop .36s cubic-bezier(.3,1.4,.5,1) .10s both; }
#er-qtyv2.qt .qt-ic.go .b3{ animation:qtdrop .36s cubic-bezier(.3,1.4,.5,1) .20s both; }
#er-qtyv2.qt .qt-ic .pb{ opacity:0; }
#er-qtyv2.qt .qt-ic.go .pb{ animation:qtfade .25s ease both; }
@keyframes qtfade{ to{opacity:1} }


/* ===== FOOTER/NEWSLETTER overrides MIGRATED to ce_meta._elementor_data 2026-06-18 =====
   Anteriormente: 35 regras .elementor-element-{744c8bc5,nlcolL,nlimg,nlcolR,16f957e4,
                  6b634e7f,prrbar01,1b38c5cc,nlhead,nlsub,metpag03} para forçar overrides
                  do footer/newsletter sem mexer no custom.css.
   Migradas para `settings.custom_css` em cada widget nos 7 footers (id_ce_content=18)
   via runner aplicado a 2026-06-18 (backup automático em ce_meta._elementor_data_backup_css_mig_*).
   Marker no JSON: `CSS-MIGRATION-2026-06-18 START/END`. Padrão MR !33. */