/* Atacado, terceiro lote: pedido aberto, pagamento por Pix e pedido recebido.
   Vem depois de atacado.css (lote 1) e lote2.css. Tudo com escopo de página (.pag-pedido, .pag-pix, .pag-obrigado)
   e nomes próprios (pd-, px-, ob-, l3-) para não bater com as classes do varejo. */

/* ---------- comuns ---------- */
.pag-l3 .nw{white-space:nowrap}
.pag-l3 .l3-zap svg,.pag-l3 .pd-rep svg,.pag-l3 .ob-acoes svg,.pag-l3 .pd-volta svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.pag-l3 .btn,.pag-l3 .btn-sec{text-decoration:none}
.l3-itens{list-style:none;display:grid;margin:0;padding:0}
.l3-itens li{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--linha)}
.l3-itens li img{width:56px;height:56px;object-fit:contain;border:1px solid var(--linha);border-radius:var(--raio-in);background:#fff}
.l3-itens li div{display:grid;gap:1px;min-width:0}
.l3-itens li a,.l3-itens .l3-nm{color:var(--tinta);text-decoration:none;font-weight:700;font-size:.9375rem;line-height:1.35;overflow-wrap:anywhere}
.l3-itens li a{padding-block:12px;margin-block:-12px;position:relative}
.l3-itens li a:hover{color:var(--terra-dk);text-decoration:underline}
.l3-itens li small{display:block;font-size:.8125rem;color:var(--apoio);line-height:1.4}
.l3-itens li>b{font-size:.9375rem;white-space:nowrap}
.l3-contas{display:grid;gap:8px;padding:14px 0;border-bottom:1px solid var(--linha);font-size:.9375rem}
.l3-contas p{display:flex;justify-content:space-between;align-items:center;gap:16px}
.l3-contas p>span:first-child{color:var(--apoio)}
.l3-contas .l3-desc .num{color:var(--ok);font-weight:700;white-space:nowrap}
.l3-total{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-top:14px;font-weight:700}
.l3-total small{display:block;font-size:.8125rem;font-weight:500;color:var(--apoio)}
.l3-total b{font-size:1.5rem;font-weight:900;white-space:nowrap}
.l3-cartao{background:#fff;border-radius:var(--raio);box-shadow:var(--sombra-m);padding:22px;display:grid}
.l3-cartao h2{font-size:1.0625rem;font-weight:900;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.l3-cartao h2 small{font-size:.875rem;font-weight:500;color:var(--apoio)}
.l3-linha{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:.9375rem;line-height:1.45}
.l3-linha svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none;color:var(--terra-dk);margin-top:1px}
.l3-linha b{display:block}
.l3-link{display:inline-flex;align-items:center;min-height:44px;margin-top:8px;font-weight:700;justify-self:start}
.previa-nav{max-width:1040px;margin:0 auto;padding:0 clamp(16px,3vw,32px) 40px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px;font-size:.875rem;color:var(--apoio)}
.previa-nav a{display:inline-flex;align-items:center;min-height:44px;font-weight:700}
.pag-pix:not(.pix-vencido) .pn-vivo,.pag-pix.pix-vencido .pn-venc{display:none}

/* ---------- A. pedido aberto ---------- */
.pag-pedido .pd{display:grid;gap:16px}
.pag-pedido .pd-volta{display:inline-flex;align-items:center;gap:6px;min-height:44px;justify-self:start;font-weight:700;font-size:.9375rem;text-decoration:none;margin-bottom:-8px}
.pag-pedido .pd-volta:hover{text-decoration:underline}
.pag-pedido .pd-cab{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"tit acoes" "sub acoes" "nota nota";gap:4px 24px;align-items:center}
.pag-pedido .pd-tit{grid-area:tit;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.pag-pedido .pd-sub{grid-area:sub;color:var(--apoio)}
.pag-pedido .pd-acoes{grid-area:acoes;display:flex;gap:10px}
.pag-pedido .pd-acoes .btn,.pag-pedido .pd-acoes .btn-sec{width:auto;min-height:48px;padding:10px 20px;font-size:1rem;white-space:nowrap;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.pag-pedido .pd-rep-nota{grid-area:nota;font-size:.875rem;color:var(--apoio);margin-top:4px}
.pag-pedido .ped-passos .bola svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.pag-pedido .ped-passos li span:not(.bola){display:flex;flex-wrap:wrap;gap:4px 6px;align-items:center}
.pag-pedido .ped-info{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.pag-pedido .ped-bloco h2 svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.pag-pedido .ped-bloco p b.l3-inline{display:inline}
.pag-pedido .ped-bloco .l3-regra{color:var(--apoio);font-size:.875rem;margin-top:4px}
.pag-pedido .ped-bloco .pi-t+p{margin-top:2px}
.pag-pedido .pd-itens{gap:0}
.pag-pedido .pd-itens h2{margin-bottom:0}
.pag-pedido .pd-itens .l3-contas,.pag-pedido .pd-itens .l3-total{max-width:420px;width:100%;justify-self:end}
.pag-pedido .pd-itens .l3-contas{border-bottom:1px solid var(--linha)}
@media (max-width:1100px){
  .pag-pedido .pd-cab{grid-template-columns:minmax(0,1fr);grid-template-areas:"tit" "sub" "acoes" "nota"}
  .pag-pedido .pd-acoes{margin-top:10px;flex-wrap:wrap}
}
@media (max-width:900px){
  .pag-pedido .ped-info{grid-template-columns:minmax(0,1fr)}
  .pag-pedido .pd-itens .l3-contas,.pag-pedido .pd-itens .l3-total{max-width:none}
}
@media (max-width:560px){
  .pag-pedido .pd-acoes{display:grid;grid-template-columns:minmax(0,1fr)}
  .pag-pedido .pd-acoes .btn,.pag-pedido .pd-acoes .btn-sec{width:100%;min-height:52px}
  .pag-pedido .l3-itens li{grid-template-columns:48px minmax(0,1fr) auto;gap:10px}
  .pag-pedido .l3-itens li img{width:48px;height:48px}
}

/* ---------- B. pagamento por Pix ---------- */
.pag-pix .px{max-width:1040px;margin-inline:auto;padding:32px clamp(16px,3vw,32px) 32px;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start}
.pag-pix .px>*{min-width:0}
.px-olho{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:.9375rem;color:var(--apoio);margin-bottom:8px}
.px-olho b{color:var(--tinta)}
.px-rec{display:inline-flex;align-items:center;gap:4px;color:var(--ok);font-weight:700}
.px-rec svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.pag-pix .px h1{font-size:clamp(1.75rem,1.4rem + 1.2vw,2.25rem);font-weight:900;line-height:1.12;letter-spacing:-.015em;outline-offset:6px}
.px-lead{margin-top:8px;font-size:1.0625rem}
.px-valor{margin-top:20px;padding:18px 20px;background:#fff;border-radius:var(--raio);box-shadow:var(--sombra-p);border-left:4px solid var(--ok);display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 24px;align-items:center}
.px-valor>div{display:grid}
.px-vr{font-size:.8125rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--apoio)}
.px-valor>div b{font-size:clamp(1.875rem,1.5rem + 1.6vw,2.5rem);font-weight:900;line-height:1.1;white-space:nowrap}
.px-valor p{font-size:.9375rem;color:var(--apoio);line-height:1.5}
.px-valor p b{color:var(--ok);white-space:nowrap}
.px-prazo{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:8px 14px;border-radius:999px;background:var(--aviso-bg);color:var(--aviso-tx);font-size:.9375rem;font-weight:700}
.px-prazo svg,.px-chip svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.px-prazo span{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.px-passo{margin-top:20px}
.px-passo label{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-weight:700}
.px-cod{display:flex;gap:10px;align-items:stretch;margin-top:8px}
.px-cod input{flex:1;min-width:0;font:inherit;font-size:.9375rem;min-height:56px;padding:12px 14px;border:1px solid var(--borda);border-radius:var(--raio-in);background:#fff;color:var(--tinta);text-overflow:ellipsis}
.px-cod input:focus-visible{outline:2px solid var(--terra-dk);outline-offset:2px}
.pag-pix .px-cod .btn{width:auto;white-space:nowrap;padding-inline:22px}
.px-cod .btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.px-cod .btn.feito{background:var(--ok)}
.px-dica{margin-top:8px;font-size:.875rem;color:var(--apoio)}
.px-qrbox{display:grid;justify-items:center;gap:10px;padding:20px;border:1px solid var(--linha);border-radius:var(--raio);background:#fff}
.px-qr{width:220px;height:220px;max-width:100%}
.px-qrbox p{font-size:.875rem;color:var(--apoio);text-align:center;max-width:30ch}
.px-qr-cel{display:none}
.px-qr-cel .aberto{display:none}.px-qr-cel[open] .aberto{display:inline}.px-qr-cel[open] .fechado{display:none}
.px-lado{display:grid;gap:16px}
.px-depois{margin-top:32px;padding-top:24px;border-top:1px solid var(--linha)}
.px-depois h2{font-size:1.25rem;font-weight:900}
.px-depois ol{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:14px}
.px-depois li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:start}
.px-n{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--borda);font-weight:900;font-size:.9375rem;color:var(--terra-dk)}
.px-depois li div{display:grid;gap:1px}
.px-depois li span:not(.px-n){font-size:.9375rem;color:var(--apoio)}
/* estado: Pix vencido */
.px-so-venc{display:none}
.pix-vencido .px-vivo{display:none}
.pix-vencido .px-so-venc{display:block}
.pix-vencido .px-valor{border-left-color:var(--borda)}
.px-venc{margin-top:20px;padding:20px;border-radius:var(--raio);background:#fff;box-shadow:var(--sombra-p)}
.pix-vencido .px-venc{display:grid;gap:12px}
.px-chip{display:inline-flex;align-items:center;gap:8px;justify-self:start;padding:6px 12px;border-radius:999px;background:var(--aviso-bg);color:var(--aviso-tx);font-size:.9375rem;font-weight:700}
.px-venc-acoes{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
.pag-pix .px-venc-acoes .btn,.pag-pix .px-venc-acoes .btn-sec{width:auto;min-height:52px;padding-inline:24px;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:8px}
@media (max-width:860px){
  .pag-pix .px{grid-template-columns:minmax(0,1fr);gap:24px;padding-top:24px}
  .pag-pix .px-qr-pc{display:none}
  .px-qr-cel{display:block;margin-top:16px;border:1px solid var(--linha);border-radius:var(--raio-in);background:#fff}
  .px-qr-cel summary{min-height:48px;display:flex;align-items:center;padding:0 16px;font-weight:700;color:var(--terra-dk);cursor:pointer}
  .px-qr-cel .px-qrbox{border:0}
}
@media (max-width:560px){
  .px-valor{grid-template-columns:minmax(0,1fr)}
  .px-cod{flex-direction:column}
  .pag-pix .px-cod .btn{width:100%}
  .pag-pix .px-venc-acoes{display:grid;grid-template-columns:minmax(0,1fr)}
  .pag-pix .px-venc-acoes .btn,.pag-pix .px-venc-acoes .btn-sec{width:100%}
}

/* ---------- C. pedido recebido ---------- */
.pag-obrigado .ob{max-width:1040px;margin-inline:auto;padding:40px clamp(16px,3vw,32px) 32px;display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:40px;align-items:start}
.pag-obrigado .ob>*{min-width:0}
.ob-topo{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:start}
.ob-selo{width:64px;height:64px;border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center;box-shadow:0 0 0 8px #e6f2ec}
.ob-selo svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.pag-obrigado .ob h1{font-size:clamp(1.875rem,1.5rem + 1.4vw,2.5rem);font-weight:900;line-height:1.1;letter-spacing:-.015em}
.pag-obrigado .px-olho .st{display:inline-flex;align-items:center;padding:4px 12px;border-radius:999px;font-size:.8125rem;font-weight:700;white-space:nowrap;background:#e6f2ec;color:var(--ok)}
.ob-lead{margin-top:8px;font-size:1.0625rem;max-width:46ch}
.ob-acoes{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.pag-obrigado .ob-acoes .btn,.pag-obrigado .ob-acoes .btn-sec{width:auto;min-height:52px;padding:12px 24px;margin:0;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:1rem}
.ob-passo{margin-top:32px}
.ob-passo h2{font-size:.8125rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--apoio);margin-bottom:10px}
.ob-prox{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;padding:20px 22px;background:#fff;border-radius:var(--raio);box-shadow:var(--sombra-p)}
.ob-prox>svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;color:var(--terra-dk)}
.ob-prox h3{font-size:1.1875rem;font-weight:900;line-height:1.25}
.ob-prox p{margin-top:6px;font-size:.9375rem;line-height:1.5}
.ob-prox p:first-of-type{font-size:1rem;font-weight:700}
.ob-prox .ob-menor{color:var(--apoio);font-size:.875rem}
.ob-duvida{margin-top:20px;font-size:.9375rem;color:var(--apoio)}
.ob-duvida a{font-weight:700;display:inline-block;padding-block:12px;margin-block:-12px}
/* folha dos três próximos passos */
.ob-estados{max-width:1180px;margin-inline:auto;padding:32px clamp(16px,3vw,32px) 56px}
.ob-estados h1{font-size:1.75rem;font-weight:900;letter-spacing:-.01em}
.ob-estados .intro{margin-top:8px;color:var(--apoio);max-width:80ch}
.oe-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:24px;align-items:start}
.oe header h2{font-size:1.0625rem;font-weight:900}
.oe header p{font-size:.875rem;color:var(--apoio);margin:2px 0 12px}
@media (max-width:900px){
  .pag-obrigado .ob{grid-template-columns:minmax(0,1fr);gap:28px;padding-top:28px}
  .oe-grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  .ob-topo{grid-template-columns:minmax(0,1fr);gap:14px}
  .ob-selo{width:52px;height:52px;box-shadow:0 0 0 6px #e6f2ec}
  .ob-selo svg{width:28px;height:28px}
  .ob-acoes{display:grid;grid-template-columns:minmax(0,1fr)}
  .pag-obrigado .ob-acoes .btn,.pag-obrigado .ob-acoes .btn-sec{width:100%}
  .ob-prox{padding:18px 16px;gap:12px}
  .l3-cartao{padding:18px 16px}
}

/* ---------- movimento: só como resposta, e só para quem não pediu menos movimento ---------- */
@media (prefers-reduced-motion:no-preference){
  /* o selo do pedido recebido se desenha uma vez: é a confirmação de que o pagamento entrou */
  .ob-selo{animation:ob-selo .5s cubic-bezier(.2,.8,.2,1) both}
  .ob-selo svg path{stroke-dasharray:24;stroke-dashoffset:24;animation:ob-traco .45s .3s ease-out forwards}
  @keyframes ob-selo{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}
  @keyframes ob-traco{to{stroke-dashoffset:0}}
  /* botão de copiar muda de cor ao copiar; código novo pisca uma vez */
  .px-cod .btn{transition:background-color .2s}
  .pix-novo .px-cod input{animation:px-novo 1.2s ease-out 1}
  @keyframes px-novo{from{box-shadow:0 0 0 4px rgba(31,122,77,.35)}to{box-shadow:0 0 0 4px rgba(31,122,77,0)}}
}

/* ============ Segunda rodada (14/10): Direção e Revisão ============ */
/* frete de exemplo nas contas: etiqueta antes do valor */
.l3-frete{display:inline-flex;align-items:center;gap:8px}
.so-venc{display:none}
.pix-vencido .so-vivo{display:none}
.pix-vencido .so-venc{display:block}
.pag-pedido .pn-pedido{padding:0;margin:0;max-width:none}
.pag-pedido:not(.pix-vencido) .pn-vivo,.pag-pedido.pix-vencido .pn-venc{display:none}
.previa-nav button{display:inline-flex;align-items:center;min-height:44px;font:inherit;font-weight:700;color:var(--terra-dk);background:none;border:0;padding:0;text-decoration:underline;cursor:pointer}
/* A5: cabeçalho enxuto em 320, etiqueta "Atacado" embaixo do logo (mesma regra do checkout, com o escopo destas telas) */
@media (max-width:720px){ .pag-l3 .cab-at .tag-loja{height:20px;padding:0 8px;font-size:.75rem} }
@media (max-width:380px){ .pag-l3 .cab-at .cab-logo{flex-direction:column;align-items:flex-start;gap:2px} .pag-l3 .cab-at .cab-logo img{height:30px} .pag-l3 .cab-at .tag-loja{height:18px} }

/* Pix: situação ao lado do número (aguardando ou vencido), nas fichas de aviso; "Pedido recebido" fica para a tela seguinte */
.px-sit{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;background:var(--aviso-bg);color:var(--aviso-tx);font-size:.8125rem;font-weight:700}
.px-sit svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pag-pix .px-cod .btn{min-width:232px}
.px-erro{display:flex;gap:8px;align-items:flex-start;margin-top:8px;font-size:.9375rem;font-weight:700;color:var(--erro)}
.px-erro[hidden]{display:none}
.px-erro svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
@media (max-width:560px){ .pag-pix .px-cod .btn{min-width:0} }

/* pedido aberto: andamento em quatro etapas, com o estado escrito */
.pag-pedido .pd-passos{grid-template-columns:repeat(4,minmax(0,1fr))}
.pag-pedido .pd-passos li{align-content:start}
.pag-pedido .pd-passos .ps-e{font-style:normal;font-size:.6875rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--apoio)}
.pag-pedido .pd-passos .ps-feito .ps-e{color:var(--ok)}
.pag-pedido .pd-passos .ps-atual .ps-e{color:var(--terra-dk)}
.pag-pedido .pd-passos .ps-atual .bola{background:var(--ok);border-color:var(--ok);color:#fff;box-shadow:0 0 0 4px #e6f2ec}
.pag-pedido .pd-passos .ps-atual b{color:var(--tinta);font-weight:900}
.pag-pedido .pd-passos .ps-seg .bola{background:#fff;border:2px solid var(--borda);box-shadow:none}
.pag-pedido .pd-passos .ps-seg b{color:var(--apoio);font-weight:600}
.pag-pedido .pd-cab{grid-template-areas:"tit acoes" "sub acoes"}
.pag-pedido .pd-acoes .pd-pagar{min-width:0}
.pag-pedido .aviso-ex{margin:8px 0 0}
@media (max-width:1100px){ .pag-pedido .pd-cab{grid-template-areas:"tit" "sub" "acoes"} }
@media (max-width:900px){
  /* celular: o andamento vem antes dos botões e a saudação sai, para o andamento caber na primeira tela */
  .pag-pedido .conta-lado .ola{display:none}
  .pag-pedido .pd-cab{display:contents}
  .pag-pedido .pd-volta{order:1}
  .pag-pedido .pd-tit{order:2}
  .pag-pedido .pd-sub{order:3;margin-top:-12px}
  .pag-pedido .pd-passos{order:4;grid-template-columns:minmax(0,1fr)}
  .pag-pedido .pd-acoes{order:5;margin-top:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .pag-pedido .pd>*:not(.pd-volta):not(.pd-cab):not(.pd-passos){order:6}
  .pag-pedido .pd-acoes .btn,.pag-pedido .pd-acoes .btn-sec{width:100%;min-height:48px;padding:8px 10px;font-size:.9375rem;white-space:normal;line-height:1.2;text-align:center}
}
@media (max-width:560px){ .pag-pedido .pd-acoes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))} .pag-pedido .pd-acoes .btn,.pag-pedido .pd-acoes .btn-sec{min-height:48px} }
@media (max-width:380px){ .pag-pedido .pd-acoes svg{display:none} }

/* pedido recebido: produtos do resumo recolhidos e convite de conta */
.ob-itens summary{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--terra-dk);cursor:pointer;font-size:.9375rem}
.ob-itens{border-bottom:1px solid var(--linha)}
.ob-itens .l3-itens li:last-child{border-bottom:0}
.ob-conta{margin-top:20px;padding:18px 22px;border:1px dashed var(--borda);border-radius:var(--raio);display:grid;gap:6px}
.ob-conta h2{font-size:1.0625rem;font-weight:900}
.ob-conta p{font-size:.9375rem;color:var(--apoio)}
.ob-conta form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end;margin-top:6px}
.pag-obrigado .ob-conta .btn-sec{min-height:48px;padding:10px 22px;margin:0;width:auto;white-space:nowrap}
.ob-conta .campo{display:grid;gap:4px}
.ob-conta .campo label{font-size:.875rem;font-weight:700}
.ob-conta .campo input{font:inherit;min-height:48px;padding:10px 14px;border:1px solid var(--borda);border-radius:var(--raio-in);background:#fff;min-width:0;width:100%}
@media (max-width:560px){ .ob-conta form{grid-template-columns:minmax(0,1fr)} .pag-obrigado .ob-conta .btn-sec{width:100%} .ob-conta{padding:16px} }
@media (max-width:900px){
  .pag-pedido .pd{grid-template-columns:minmax(0,1fr)}
  .pag-pedido .pd-tit,.pag-pedido .pd-sub,.pag-pedido .pd-acoes{grid-area:auto;grid-column:1}
  .pag-pedido .pd>*{grid-column:1}
}

/* ============ Última passada (14/10) ============ */
.pag-pedido .pd-passos .ps-e{font-size:.75rem}
.pag-pedido .pd-passos .ps-prazo{white-space:nowrap}
.pag-pedido .pd-pagar-cx{display:none}
@media (max-width:900px){
  /* pedido sem pagamento: a linha de pagamento vem antes do andamento; "Falar com o atacado" desce para depois dele */
  .pag-aguarda .pd-pagar-cx{display:grid;gap:10px;order:3;grid-column:1;padding:14px;border-radius:var(--raio);background:var(--aviso-bg);border:1px solid rgba(122,74,0,.18)}
  .pag-aguarda .pd-pagar-cx p{display:flex;justify-content:space-between;align-items:baseline;gap:12px;color:var(--aviso-tx);font-weight:700}
  .pag-aguarda .pd-pagar-cx p b{font-size:1.375rem;font-weight:900;color:var(--tinta);white-space:nowrap}
  .pag-aguarda .pd-pagar-cx .btn{width:100%;min-height:54px;margin:0}
  .pag-aguarda .pd-acoes .pd-pagar{display:none}
  .pag-aguarda .pd-acoes{grid-template-columns:minmax(0,1fr)}
  .pag-aguarda .pd-acoes svg{display:block}
}

/* ============ Parecer de plataforma (14/10): Pix vencido = pedido cancelado; prazo do Pix de 1 hora ============ */
.pix-vencido .px-so-venc.l3-link{display:inline-flex}
.pag-pix .px-venc-acoes .btn{text-decoration:none}
.px-sit-t[data-venc]{white-space:nowrap}
.pix-vencido .px-sit{background:#f1ebe4;color:var(--apoio)}
.conta-at .st-cancel,.pag-pedido .st-cancel{background:#f1ebe4;color:var(--apoio)}
.pix-vencido.pag-pedido .pd-passos{display:none}
.pd-cancel{padding:18px 22px;border-radius:var(--raio);background:#fff;box-shadow:var(--sombra-p);border-left:4px solid var(--borda)}
.pix-vencido .pd-cancel{display:grid;gap:6px}
.pd-cancel h2{font-size:1.1875rem;font-weight:900;line-height:1.25}
.pd-cancel p{font-size:.9375rem;color:var(--apoio)}
@media (max-width:900px){
  .pag-pedido .pd-cancel{order:4}
  .pix-vencido .pd-pagar-cx{background:#fff;border-color:var(--linha)}
  .pix-vencido .pd-pagar-cx .pd-cx-venc{display:block;font-weight:700;color:var(--tinta)}
  /* cancelado: o aviso vem antes da caixa com o botão */
  .pix-vencido.pag-pedido .pd-cancel{order:3}
  .pix-vencido.pag-pedido .pd-pagar-cx{order:4}
  .pix-vencido.pag-pedido .pd-cx-venc{display:none}
}

.pag-aguarda .pd-pagar-cx p.so-venc,.pix-vencido.pag-aguarda .pd-pagar-cx p.so-vivo{display:none}
.px-prazo{border-radius:var(--raio-in)}
.px-prazo span{display:inline;line-height:1.4}
.px-prazo .conf{margin-left:4px}

/* ============ tema (dados reais no lugar dos de exemplo; ajustes por diferença de folhas entre a prévia e o tema) ============ */
/* produto sem foto no resumo e na lista do pedido */
.l3-itens .sem-img{display:block;width:56px;height:56px;border:1px solid var(--linha);border-radius:var(--raio-in);background:#f4ede4}
@media (max-width:560px){ .pag-pedido .l3-itens .sem-img{width:48px;height:48px} }
/* pedido cancelado por outro motivo ou pagamento recusado: o aviso não depende do Pix vencido */
.pd-cancel-a{display:grid;gap:6px}
/* "Já paguei, conferir agora": confere na hora (a tela também muda sozinha). Alvo de 44 px */
.px-ja{justify-self:start;display:inline-flex;align-items:center;min-height:44px;margin-top:2px;padding:0;background:none;border:0;font:inherit;font-weight:700;color:var(--terra-dk);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.px-ja:disabled,.px-ja[aria-disabled=true]{opacity:.6;cursor:default}
.px-ja:focus-visible{outline:2px solid var(--terra-dk);outline-offset:2px;border-radius:4px}
.px-ja-msg{font-size:.875rem;color:var(--apoio)}
.px-ja-msg:empty{display:none}
/* QR desenhado pelo script (div com o desenho dentro) */
.px-qr{display:block}
.px-qr svg{display:block;width:100%;height:100%}
/* pedido recebido sem o selo (cartão em análise, pagamento recusado) e estados da fila de situação */
.ob-topo.sem-selo{grid-template-columns:minmax(0,1fr)}
.pag-obrigado .px-olho .st.st-pix{background:var(--aviso-bg);color:var(--aviso-tx)}
.pag-obrigado .px-olho .st.st-erro{background:#fbe9e7;color:var(--erro)}
.ob-conta-ok{border-style:solid;background:#e6f2ec;border-color:transparent}
.ob-conta-ok a{font-weight:700;display:inline-flex;align-items:center;min-height:44px}
.ob-conta .px-erro{margin-top:0}
.ob-conta .dica{font-size:.8125rem;color:var(--apoio)}
.pag-pedido .ob-conta{margin-top:0}
.pag-pedido .ob-conta .btn-sec{min-height:48px;padding:10px 22px;margin:0;width:auto;white-space:nowrap}
@media (max-width:560px){ .pag-pedido .ob-conta .btn-sec{width:100%} }
/* a tela do Pix vira "Pedido recebido" sozinha: o bloco novo aparece em 240 ms; com "menos movimento", troca seca */
@media (prefers-reduced-motion:no-preference){
  .ob-entra{animation:ob-entra .24s cubic-bezier(.2,.7,.2,1) both}
  @keyframes ob-entra{from{opacity:0}to{opacity:1}}
}
/* o link do passo do andamento (rastreio) e links de ajuda com alvo de 44 px */
.pag-pedido .ped-passos .passo-link{min-height:44px}
.l3-link{text-decoration:underline;text-underline-offset:3px}
/* "Mostrar" a senha (conta): alvo de 44 px no atacado (no varejo são 42) */
.loja-atacado .conta-at .senha button{min-height:44px}
/* pedido aberto pela chave (quem comprou sem conta), fora da moldura da conta: a mesma largura e a mesma caixa de dúvidas */
.pag-pedido .ac-res{max-width:none}
.pag-pedido .duvida{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;margin-top:24px;padding:20px 22px;border-radius:var(--raio);background:#fff;box-shadow:var(--sombra-p);border:0}
.pag-pedido .duvida h2{font-size:1.125rem;font-weight:900}
.pag-pedido .duvida .btn-sec{min-height:48px}
@media (max-width:560px){ .pag-pedido .duvida .acoes,.pag-pedido .duvida .btn-sec{width:100%} }
/* inscrição estadual em maiúsculas na tela (o plugin mo-documentos-br grava em maiúsculas) */
.dados-f #billing_ie{text-transform:uppercase}
/* tela "Ver o seu pedido" (confirmar o e-mail, de quem volta depois de alguns minutos): o link da frase com alvo de 44 px */
.pag-l3 .verifica .lead a{display:inline-block;padding-block:11px;margin-block:-11px}
/* Pedido recebido (item 19): "Criar conta" alinhado ao campo de senha, não ao conjunto campo mais dica */
@media (min-width:561px){ .ob-conta form{align-items:start} .pag-obrigado .ob-conta form .btn-sec{margin-top:25px} }
/* Pedido aberto no celular (item 20): rótulo curto no botão do WhatsApp, em uma linha de 48 px ao lado de "Repetir pedido" */
.zt-c{display:none}
@media (max-width:900px){ .pag-pedido .pd-acoes .l3-zap .zt-l{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap} .pag-pedido .pd-acoes .l3-zap .zt-c{display:inline} }


/* Alvos de toque de 44 px (revisão A8): seletor Empresa/Pessoa física, "Mostrar" da senha em todas as telas do atacado */
.loja-atacado .seg span{display:flex;align-items:center;min-height:44px;padding-block:0}
.loja-atacado .senha button{min-height:44px}
/* "Mostrar" da senha no convite de conta do pedido recebido (S8): mesmo componente da tela de entrar */
.ob-conta .senha{position:relative}
.ob-conta .senha input{width:100%;padding-right:112px}
.ob-conta .senha button{position:absolute;right:4px;top:4px;bottom:4px;display:inline-flex;align-items:center;padding:0 12px;border:0;border-radius:6px;background:none;font:inherit;font-size:.875rem;font-weight:700;color:var(--terra-dk);cursor:pointer}
.ob-conta .senha button:hover{background:var(--papel)}
.ob-conta .senha button[hidden]{display:none}
/* A9: erros da conta no padrão do checkout, também em campos do Woo (.form-row) */
.conta-at .form-row.tem-erro input,.conta-at .form-row.tem-erro select{border-color:var(--erro);box-shadow:0 0 0 1px var(--erro)}
.conta-at .form-row .msg-erro,.conta-at .campo .msg-erro{margin-top:6px}
.conta-at .resumo-erros{margin-top:0}