/* Lista de pedido: botão do card e do produto, barra do rodapé e gaveta. Petróleo #021a22, laranja
   #f7391f no botão, verde #07910b no WhatsApp, Poppins, pílula. O tema pinta todo <button>
   (hover rosa do Hello): cor, fundo e borda vão com !important. */

.trink-lista-btn, .trink-lista-passo, .trink-lista-barra, .trink-lista-gaveta { font-family: "Poppins Custom", Poppins, sans-serif; }
.trink-lista-btn svg, .trink-lista-passo svg, .trink-lista-barra svg, .trink-lista-gaveta svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Botão "Adicionar à lista" e o "− n +" que o substitui */
.trink-lista-btn { position: relative; z-index: 2; display: inline-flex !important; align-items: center; justify-content: center; gap: 6px; min-height: 40px; margin: 0 auto 12px !important; padding: 0 18px !important;
  border: 0 !important; border-radius: 999px !important; background: #fff1ee !important; color: #f7391f !important; font-size: 13px !important; font-weight: 600 !important; line-height: 1 !important; cursor: pointer; transition: background .15s; }
.trink-lista-btn:focus-visible { background: #f7391f !important; color: #fff !important; }
.trink-lista-btn__mais { font-size: 17px; font-weight: 500; }
.trink-lista-btn[hidden], .jet-listing-grid__item .trink-lista-btn[hidden], .trink-card .trink-lista-btn[hidden] { display: none !important; }
.trink-lista-widget .elementor-shortcode { text-align: center; }
/* No card do catálogo (168 px no celular) os dois ocupam a largura do card, com o respiro dos detalhes */
/* O card centraliza os widgets (align-items: center) e o do shortcode encolhia no texto dos detalhes. */
.jet-listing-grid__item .trink-lista-widget, .trink-card .trink-lista-widget { align-self: stretch; }
.jet-listing-grid__item .trink-lista-btn, .jet-listing-grid__item .trink-lista-passo, .trink-card .trink-lista-btn, .trink-card .trink-lista-passo { display: flex !important; width: calc(100% - 24px); max-width: 220px; margin: 0 auto 12px !important; }
.jet-listing-grid__item .trink-lista-btn, .trink-card .trink-lista-btn { padding: 0 10px !important; }
.jet-listing-grid__item .trink-lista-passo, .trink-card .trink-lista-passo { justify-content: space-between; }
.jet-listing-grid__item .trink-lista-passo > span, .trink-card .trink-lista-passo > span { flex: 1; min-width: 0; font-size: 12px; }
/* Card do catálogo (template 381): o card estica até a altura da linha da grade e o botão desce pro pé,
   na mesma altura em todos os cards, por mais linhas que os detalhes tenham. */
.jet-listing-grid__item > .jet-engine-listing-overlay-wrap, .jet-listing-grid__item .elementor-381, .jet-listing-grid__item .elementor-381 > .e-con { height: 100%; }
.elementor-381 .elementor-element-a7c1e10 { flex-grow: 1; align-self: stretch; display: flex; flex-direction: column; }
.elementor-381 .elementor-element-a7c1e10 > .elementor-widget-container, .elementor-381 .elementor-element-a7c1e10 .elementor-shortcode { flex: 1; display: flex; flex-direction: column; }
.elementor-381 .elementor-element-a7c1e10 .trink-lista-btn, .elementor-381 .elementor-element-a7c1e10 .trink-lista-passo { margin-top: auto !important; width: calc(100% - 24px) !important; }

.trink-lista-passo { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 4px; min-height: 40px; margin: 0 auto 12px; padding: 3px; border-radius: 999px; background: #021a22; color: #fff; font-size: 13px; }
.trink-lista-passo > span { min-width: 76px; padding: 0 4px; text-align: center; white-space: nowrap; }
.trink-lista-passo b { font-weight: 700; color: #3ce6f2; }
.trink-lista-passo button { display: grid !important; place-items: center; flex: 0 0 auto; min-width: 0 !important; width: 34px; height: 34px; padding: 0 !important; border: 0 !important; border-radius: 50% !important; background: rgba(255,255,255,.1) !important; color: #fff !important; cursor: pointer; }
.trink-lista-passo button:focus-visible { background: #f7391f !important; color: #fff !important; }

/* Na página da tampa o botão fica sobre o card vermelho: pílula branca, maior */
.trink-produto .trink-lista-btn { min-height: 48px; margin: 4px auto 16px !important; padding: 0 24px !important; background: #fff !important; color: #021a22 !important; font-size: 15px !important; box-shadow: 0 8px 20px -8px rgba(0,0,0,.35); }
.trink-produto .trink-lista-btn:focus-visible { background: #021a22 !important; color: #fff !important; }
.trink-produto .trink-lista-passo { min-height: 48px; margin: 4px auto 16px; font-size: 15px; }
.trink-produto .trink-lista-passo button { width: 40px; height: 40px; }
.trink-produto .trink-lista-passo > span { min-width: 92px; }

/* Barra do rodapé */
.trink-lista-barra { position: fixed; z-index: 99990; left: 50%; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); width: min(520px, calc(100vw - 24px)); }
.trink-lista-barra[hidden] { display: none !important; }
.trink-lista-barra__abrir { display: flex !important; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 8px 8px 8px 10px !important; border: 0 !important; border-radius: 999px !important;
  background: #021a22 !important; color: #fff !important; text-align: left; cursor: pointer; box-shadow: 0 16px 40px -12px rgba(2,26,34,.6); }
.trink-lista-barra__abrir:focus-visible { background: #06303b !important; color: #fff !important; }
.trink-lista-barra__icone { position: relative; display: grid; place-items: center; flex: 0 0 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.1); color: #3ce6f2; }
.trink-lista-barra__icone svg { width: 22px; height: 22px; }
.trink-lista-barra__icone b { position: absolute; top: -4px; right: -6px; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: #f7391f; color: #fff; font-size: 12px; font-weight: 700; line-height: 22px; text-align: center; }
.trink-lista-barra__txt { display: flex; flex: 1; flex-direction: column; min-width: 0; line-height: 1.25; }
.trink-lista-barra__txt strong { font-size: 15px; font-weight: 700; }
.trink-lista-barra__txt small { font-size: 12px; color: rgba(255,255,255,.75); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.trink-lista-barra__cta { flex: 0 0 auto; padding: 0 20px; border-radius: 999px; background: #f7391f; color: #fff; font-size: 14px; font-weight: 600; line-height: 48px; white-space: nowrap; }
.trink-lista-barra.is-pulso .trink-lista-barra__icone b { animation: trink-lista-pulso .5s ease; }
@keyframes trink-lista-pulso { 40% { transform: scale(1.35); } }
html.trink-lista-cheia body { padding-bottom: 100px; }
@media (max-width: 600px) {
  .trink-lista-barra { bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
  .trink-lista-barra__abrir { min-height: 60px; gap: 10px; }
  .trink-lista-barra__cta { padding: 0 16px; font-size: 13px; line-height: 44px; }
  html.trink-lista-cheia body { padding-bottom: 84px; }
}
/* iPhone SE (320): o resumo cortava em "1 tampa · 1..."; o número já está no selo do ícone. */
@media (max-width: 360px) { .trink-lista-barra__txt small { display: none; } }

/* Gaveta: painel à direita no desktop, folha de baixo no celular */
html.trink-lista-aberta, html.trink-lista-aberta body { overflow: hidden; }
html.trink-lista-aberta body { position: fixed; left: 0; right: 0; width: 100%; }
.trink-lista-fundo { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 99991; background: rgba(2,16,21,.55); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.trink-lista-gaveta { position: fixed; z-index: 99992; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(440px, 100vw); background: #fff; color: #141414;
  box-shadow: -24px 0 60px -20px rgba(0,0,0,.45); transform: translateX(100%); transition: transform .25s ease; }
.trink-lista-gaveta.is-aberta { transform: none; }
.trink-lista-gaveta[hidden], .trink-lista-fundo[hidden] { display: none !important; }
@media (max-width: 600px) {
  .trink-lista-gaveta { top: 6vh; width: 100vw; border-radius: 20px 20px 0 0; transform: translateY(100%); box-shadow: 0 -20px 60px -20px rgba(0,0,0,.45); }
}
.trink-lista-gaveta__topo { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px 14px 24px; border-bottom: 1px solid #ececee; }
.trink-lista-gaveta h2 { margin: 0 !important; color: #021a22 !important; font-size: 20px !important; font-weight: 700 !important; }
.trink-lista-fechar { display: grid !important; place-items: center; flex: 0 0 44px; width: 44px !important; height: 44px !important; min-width: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 50% !important; background: #f4f4f5 !important; color: #021a22 !important; cursor: pointer; }
.trink-lista-fechar:focus-visible { background: #e6e6e8 !important; color: #021a22 !important; }
.trink-lista-gaveta__corpo { flex: 1; overflow-y: auto; padding: 8px 24px calc(28px + env(safe-area-inset-bottom, 0px)); overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }

.trink-lista-itens { margin: 0 !important; padding: 0 !important; list-style: none !important; }
.trink-lista-item { display: flex; align-items: center; gap: 10px; padding: 12px 0; border-bottom: 1px solid #ececee; }
.trink-lista-item__txt { display: flex; flex: 1; flex-direction: column; min-width: 0; line-height: 1.3; }
.trink-lista-item__txt a, .trink-lista-item__txt strong { color: #021a22 !important; font-size: 15px; font-weight: 700; text-decoration: none !important; }
.trink-lista-item__txt small { color: #5b5b60; font-size: 12px; }
.trink-lista-item .trink-lista-passo { margin: 0; min-height: 36px; }
.trink-lista-item .trink-lista-passo button { width: 30px; height: 30px; }
.trink-lista-item .trink-lista-passo > span { min-width: 30px; }
.trink-lista-tirar { display: grid !important; place-items: center; flex: 0 0 32px; width: 32px; height: 32px; padding: 0 !important; border: 0 !important; border-radius: 50% !important; background: transparent !important; color: #8a8a90 !important; cursor: pointer; }
.trink-lista-tirar:focus-visible { background: #fff1ee !important; color: #f7391f !important; }
.trink-lista-tirar svg { width: 16px; height: 16px; }
.trink-lista-vazia { padding: 24px 0; color: #5b5b60; font-size: 15px; line-height: 1.5; }
.trink-lista-vazia a { color: #f7391f !important; font-weight: 600; }
/* Resumo: contagem à esquerda, "Limpar a lista" como botão contornado à direita (1º toque pede confirmação, ver lista.js) */
.trink-lista-resumo:not(:empty) { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.trink-lista-resumo { margin: 12px 0 0 !important; color: #5b5b60; font-size: 13px; }
.trink-lista-limpar { display: inline-flex !important; align-items: center !important; gap: 6px; min-height: 36px; line-height: 1 !important; padding: 0 14px !important; border: 1.5px solid #f7391f !important; border-radius: 999px !important; background: #fff !important; color: #f7391f !important; font: inherit !important; font-size: 13px !important; font-weight: 600 !important; text-decoration: none !important; cursor: pointer; transition: background .15s, color .15s; }
.trink-lista-limpar svg { display: block; flex: none; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.trink-lista-limpar:focus-visible { outline: 2px solid #f7391f; outline-offset: 2px; }
.trink-lista-limpar.is-confirmar { background: #f7391f !important; color: #fff !important; }

.trink-lista-envio { margin-top: 24px; padding: 20px; border-radius: 20px; background: #f4f4f5; }
.trink-lista-envio[hidden] { display: none; }
.trink-lista-envio h3 { margin: 0 0 12px !important; color: #021a22 !important; font-size: 16px !important; font-weight: 700 !important; }
.trink-lista-cidade label { display: block; margin-bottom: 8px; color: #141414; font-size: 14px; font-weight: 500; }
.trink-lista-cidade__caixa { position: relative; }
.trink-lista-cidade input { width: 100%; height: 48px; padding: 0 18px !important; border: 1px solid #d6d6da !important; border-radius: 999px !important; background: #fff !important; color: #141414 !important; font: 500 16px "Poppins Custom", Poppins, sans-serif !important; -webkit-appearance: none; appearance: none; box-shadow: none !important; }
.trink-lista-cidade input:focus { outline: 2px solid #f7391f; outline-offset: 1px; border-color: #f7391f !important; }
.trink-lista-sug { position: absolute; z-index: 2; top: calc(100% + 6px); left: 0; right: 0; overflow: hidden; border-radius: 16px; background: #fff; box-shadow: 0 16px 40px -12px rgba(0,0,0,.3); }
.trink-lista-sug__item { display: flex !important; align-items: center; justify-content: space-between; gap: 8px; width: 100%; padding: 11px 18px !important; border: 0 !important; border-radius: 0 !important; background: #fff !important; color: #141414 !important; font: 500 14px "Poppins Custom", Poppins, sans-serif !important; text-align: left; cursor: pointer; }
.trink-lista-sug__item small { color: #8a8a90; font-size: 12px; }
.trink-lista-sug__item.is-ativo { background: #fff1ee !important; color: #141414 !important; }
.trink-lista-sug__vazio { margin: 0 !important; padding: 12px 18px; color: #5b5b60; font-size: 13px; }
.trink-lista-cidade__escolhida { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 !important; font-size: 14px; }
.trink-lista-trocar { padding: 0 !important; border: 0 !important; background: none !important; color: #f7391f !important; font: 600 13px "Poppins Custom", Poppins, sans-serif !important; text-decoration: underline !important; cursor: pointer; }

.trink-lista-reps__dica { margin: 14px 0 0 !important; color: #5b5b60; font-size: 13px; }
.trink-lista-rep { display: flex; flex-direction: column; gap: 12px; margin-top: 12px; padding: 16px; border: 1px solid #e6e6e8; border-radius: 16px; background: #fff; }
.trink-lista-rep.is-perto { border-color: #07910b; box-shadow: 0 0 0 1px #07910b inset; }
.trink-lista-rep__rotulo { margin: 0 0 2px !important; color: #8a8a90; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.trink-lista-rep.is-perto .trink-lista-rep__rotulo { color: #07910b; }
.trink-lista-rep h4 { margin: 0 !important; color: #021a22 !important; font-size: 15px !important; font-weight: 700 !important; line-height: 1.3 !important; }
.trink-lista-rep__nome, .trink-lista-rep__regiao { margin: 2px 0 0 !important; color: #5b5b60; font-size: 13px; line-height: 1.4; }
.trink-lista-zap { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 0 22px; border-radius: 999px; background: #07910b !important; color: #fff !important;
  font-size: 15px; font-weight: 600; text-decoration: none !important; box-shadow: 0 6px 16px -6px rgba(7,145,11,.45); }
.trink-lista-zap:focus-visible { background: #067a09 !important; color: #fff !important; }

/* Toque: sem o flash cinza e sem o zoom do toque duplo nos botões */
.trink-lista-btn, .trink-lista-passo button, .trink-lista-barra__abrir, .trink-lista-gaveta button, .trink-lista-zap { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }

/* Card estreito (celular, 2 colunas): "+ Adicionar" e o contador só com o número */
@media (max-width: 480px) {
  .jet-listing-grid__item .trink-lista-btn__resto, .jet-listing-grid__item .trink-lista-passo__rotulo, .trink-card .trink-lista-btn__resto, .trink-card .trink-lista-passo__rotulo { display: none; }
  .jet-listing-grid__item .trink-lista-passo > span, .trink-card .trink-lista-passo > span { font-size: 14px; }
}

/* Hover só em quem tem mouse: no toque ele fica preso depois do clique */
@media (hover: hover) {
  .trink-lista-btn:hover { background: #f7391f !important; color: #fff !important; }
  .trink-lista-passo button:hover { background: #f7391f !important; color: #fff !important; }
  .trink-produto .trink-lista-btn:hover { background: #021a22 !important; color: #fff !important; }
  .trink-lista-barra__abrir:hover { background: #06303b !important; color: #fff !important; }
  .trink-lista-fechar:hover { background: #e6e6e8 !important; color: #021a22 !important; }
  .trink-lista-item__txt a:hover { color: #f7391f !important; }
  .trink-lista-tirar:hover { background: #fff1ee !important; color: #f7391f !important; }
  .trink-lista-limpar:hover { background: #fff1ee !important; color: #f7391f !important; }
  .trink-lista-limpar.is-confirmar:hover { background: #d92f17 !important; color: #fff !important; }
  .trink-lista-sug__item:hover { background: #fff1ee !important; color: #141414 !important; }
  .trink-lista-zap:hover { background: #067a09 !important; color: #fff !important; }
}
