/* Rastreio — modo DETALHES DO PEDIDO (deep link ?pedido=CODIGO).
   Só entra em ação com body.is-pedido; a busca por CPF (stylesrastreio.css) fica intocada. */
:root{
  --ped-verde:#16a34a;--ped-verde-d:#15803d;--ped-verde-bg:#eafaf0;--ped-verde-bd:#b9ecc9;
  --ped-marca-bg:#fdeceb;
}
.pedDetalhe[hidden]{display:none !important}

/* no modo pedido some a busca por CPF */
body.is-pedido .trkHeader,
body.is-pedido .trkSearchBox,
body.is-pedido #trkError,
body.is-pedido #trkResult{display:none !important}

/* min-width:0 — .trkWrap é grid; sem isso a timeline larga estica a página no mobile */
.pedDetalhe{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;width:100%;max-width:640px;min-width:0;margin:0 auto}
.pedCard,.pedTl,.pedTl__scroll{min-width:0}

/* carregando / não encontrado */
.pedVazio{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:28px 18px}
.pedVazio__ic{width:56px;height:56px;border-radius:50%;background:var(--ped-marca-bg);display:flex;align-items:center;justify-content:center}
.pedVazio__ic svg{width:28px;height:28px;stroke:var(--laranja)}
.pedVazio__t{margin:0;font-size:1.15rem;font-weight:700;color:var(--text)}
.pedVazio__d{margin:0;font-size:13.5px;color:var(--muted);line-height:1.5;max-width:340px}
.pedVazio .pedBtn{width:100%;max-width:280px;margin-top:6px}
.pedSpin{width:30px;height:30px;border:3px solid #e5e5e5;border-top-color:var(--laranja);border-radius:50%;animation:pedGira .7s linear infinite}
@keyframes pedGira{to{transform:rotate(360deg)}}

/* status aguardando frete: âmbar em vez de verde */
.pedStatus--pend .pedStatus__ic{background:#fff7e6;border-color:#fcd9a0}
.pedStatus--pend .pedStatus__ic svg{stroke:#b45309}
.pedStatus--pend .pedStatus__t{color:#9a5b00}

/* movimentação */
.pedMov{list-style:none;margin:0;padding:0 0 0 4px}
.pedMov li{position:relative;padding:0 0 14px 22px;border-left:2px solid var(--line)}
.pedMov li:last-child{border-left-color:transparent;padding-bottom:0}
.pedMov li::before{content:"";position:absolute;left:-7px;top:2px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid #cfcfcf}
.pedMov li:first-child::before{border-color:var(--ped-verde);background:var(--ped-verde)}
.pedMov__d{margin:0;font-size:13.5px;font-weight:600;color:var(--text)}
.pedMov__c{margin:1px 0 0;font-size:12.5px;color:var(--muted)}
.pedMov__h{margin:1px 0 0;font-size:11.5px;color:#a3a3a3}

.pedTopo{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:2px 2px 0}
.pedTopo h1{margin:0;font-size:clamp(1.15rem,4.6vw,1.45rem);font-weight:700;color:var(--text);line-height:1.3;overflow-wrap:anywhere}
.pedTopo h1 span{color:var(--laranja)}
.pedTopo a{font-size:12.5px;font-weight:600;color:var(--laranja);white-space:nowrap}

.pedCard{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:16px}
.pedCard__t{margin:0 0 12px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#555}

/* resumo: entrega agendada */
.pedStatus{display:flex;align-items:center;gap:10px;margin:0 0 10px}
.pedStatus__ic{width:40px;height:40px;border-radius:50%;background:var(--ped-verde-bg);border:1px solid var(--ped-verde-bd);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.pedStatus__ic svg{width:21px;height:21px;stroke:var(--ped-verde)}
.pedStatus__t{margin:0;font-size:17px;font-weight:700;color:var(--ped-verde-d)}
.pedMsg{margin:0 0 4px;font-size:14px;line-height:1.55;color:var(--text)}
.pedMsg strong{font-weight:700}
.pedSub{margin:0;font-size:13px;color:var(--muted)}

/* timeline horizontal arrastável */
.pedTl{position:relative;margin:16px -16px -4px;padding:0 16px}
.pedTl__scroll{display:flex;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px 0 10px;cursor:grab;user-select:none}
.pedTl__scroll::-webkit-scrollbar{display:none}
.pedTl__scroll.is-drag{cursor:grabbing;scroll-snap-type:none}
.pedTl::after{content:"";position:absolute;top:0;right:0;bottom:0;width:28px;background:linear-gradient(90deg,rgba(255,255,255,0),#fff);pointer-events:none;border-radius:0 16px 16px 0}
.pedTl.is-fim::after{display:none}
.pedStep{position:relative;flex:0 0 112px;scroll-snap-align:start;text-align:center;padding:0 4px}
.pedStep::before{content:"";position:absolute;top:15px;left:-50%;width:100%;height:3px;background:#e5e5e5;z-index:0}
.pedStep:first-child::before{display:none}
.pedStep.is-done::before,.pedStep.is-current::before{background:var(--ped-verde)}
.pedStep__dot{position:relative;z-index:1;width:32px;height:32px;margin:0 auto 8px;border-radius:50%;background:#fff;border:3px solid #dcdcdc;display:flex;align-items:center;justify-content:center}
.pedStep__dot svg{width:15px;height:15px;stroke:#fff;display:none}
.pedStep.is-done .pedStep__dot{background:var(--ped-verde);border-color:var(--ped-verde)}
.pedStep.is-done .pedStep__dot svg{display:block}
.pedStep.is-current .pedStep__dot{border-color:var(--ped-verde);box-shadow:0 0 0 5px rgba(22,163,74,.16)}
.pedStep.is-current .pedStep__dot::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--ped-verde)}
.pedStep__t{margin:0;font-size:12.5px;font-weight:600;color:#9a9a9a;line-height:1.3}
.pedStep.is-done .pedStep__t{color:var(--text)}
.pedStep.is-current .pedStep__t{color:var(--ped-verde-d);font-weight:700}
.pedStep__d{margin:3px 0 0;font-size:11.5px;color:#a3a3a3;line-height:1.3}
.pedStep.is-current .pedStep__d,.pedStep.is-done .pedStep__d{color:var(--muted)}
.pedTl__dica{margin:2px 0 0;font-size:11.5px;color:#a3a3a3;text-align:center}

/* itens */
.pedItem{display:flex;gap:12px;align-items:flex-start}
.pedItem__img{width:72px;height:72px;flex:0 0 auto;border:1px solid var(--line);border-radius:12px;background:#fff;object-fit:contain;padding:4px}
.pedItem__info{min-width:0;flex:1}
.pedItem__nome{margin:0 0 3px;font-size:14px;font-weight:700;color:var(--text);line-height:1.35;overflow-wrap:anywhere}
.pedItem__spec{margin:0 0 6px;font-size:12.5px;color:var(--muted);line-height:1.45}
.pedItem__qtd{margin:0;font-size:12.5px;color:var(--muted)}
.pedItem__qtd b{color:var(--text)}
.pedTotal{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:14px 0 0;padding:12px 0 0;border-top:1px solid var(--line)}
.pedTotal span{font-size:13.5px;color:var(--muted)}
.pedTotal strong{font-size:17px;font-weight:800;color:var(--text);white-space:nowrap}
.pedTotal__sub{margin:3px 0 0;font-size:12px;color:var(--muted);text-align:right}

/* listas chave/valor (cliente + detalhes) */
.pedLista{margin:0;display:grid;gap:0}
.pedLista > div{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:9px 0;border-bottom:1px solid var(--line-soft)}
.pedLista > div:last-child{border-bottom:0}
.pedLista dt{font-size:13px;color:var(--muted);flex:0 0 auto}
.pedLista dd{margin:0;font-size:13.5px;font-weight:600;color:var(--text);text-align:right;overflow-wrap:anywhere}
.pedLista dd.is-vazio{color:#a3a3a3;font-weight:400}
.pedLista--bloco > div{flex-direction:column;gap:2px}
.pedLista--bloco dd{text-align:left}
.pedTag{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:700;line-height:1.6}
.pedTag--ok{background:var(--ped-verde-bg);color:var(--ped-verde-d)}
.pedTag--pend{background:#fff7e6;color:#9a5b00}
.pedTag--info{background:var(--ped-marca-bg);color:var(--laranja)}
.pedLista .is-destaque dt{color:var(--text);font-weight:700}
.pedLista .is-destaque dd{font-size:15px;font-weight:800}

/* suporte */
.pedSup{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.pedSup img{height:26px;width:auto}
.pedSup__nome{margin:0;font-size:14px;font-weight:700;color:var(--text)}
.pedSup__sub{margin:0;font-size:12px;color:var(--muted)}
.pedSup__acoes{display:grid;gap:10px}
.pedBtn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:12px;font-weight:700;font-size:14.5px;text-decoration:none;font-family:inherit}
.pedBtn svg{width:19px;height:19px;flex:0 0 auto}
.pedBtn--wpp{background:var(--ped-verde);color:#fff;box-shadow:0 6px 16px rgba(22,163,74,.28)}
.pedBtn--wpp:hover{background:var(--ped-verde-d)}
.pedBtn--wpp svg{fill:#fff}
.pedBtn--mail{background:#fff;color:var(--text);border:1.5px solid var(--line)}
.pedBtn--mail:hover{border-color:var(--laranja);color:var(--laranja)}
.pedBtn--mail svg{stroke:currentColor}

@media (min-width:560px){
  .pedCard{padding:20px}
  .pedTl{margin:16px -20px -4px;padding:0 20px}
  .pedStep{flex:1 0 96px}
  .pedTl__dica{display:none}
  .pedSup__acoes{grid-template-columns:1fr 1fr}
}