.ct-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 22px}
.ct-tabs a{padding:8px 16px;border:1px solid var(--ink);border-radius:999px;text-decoration:none;font-weight:600;font-size:15px}
.ct-tabs a.on{background:var(--ink);color:var(--bg)}
.ct-pop{position:fixed;z-index:1050;width:220px;padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--bg);box-shadow:0 10px 30px rgba(0,0,0,.18)}
.ct-pop[hidden]{display:none}
.ct-pop p{margin:6px 10px 8px;color:var(--muted);font-size:13px}
.ct-pop a,.ct-pop button{display:block;width:100%;padding:10px;border:0;background:none;border-radius:8px;text-align:left;text-decoration:none;font-weight:600;font-size:15px;cursor:pointer}
.ct-pop a:hover,.ct-pop button:hover{background:var(--panel)}
.ct-pop .adm{color:#2f6bff}
.ct-form{display:grid;gap:14px;max-width:460px;margin:0 0 28px}
.ct-form label{display:grid;gap:6px;font-weight:600;font-size:14px}
.ct-form input:not([type=file]),.ct-form textarea{font:inherit;font-size:16px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)}
.ct-form input:focus,.ct-form textarea:focus{border-color:var(--ink);outline:none}
.ct-err{margin:0;color:#d1242f;font-weight:600;font-size:14px}.ct-err[hidden]{display:none}
.ct-alt{margin:0;font-size:14px}.ct-alt a{font-weight:600}
.ct-ord,.ct-rev,.rf{border:1px solid var(--line);border-radius:14px;padding:18px;margin:0 0 14px;max-width:720px}
.ct-ord header{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:4px}
.ct-st{font-size:13px;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--panel-2)}
.s-confirmado{background:#d8f3e2;color:#0d6b33}.s-aberto{background:#fff1cc;color:#8a5a00}.s-concluido{background:#dbe8ff;color:#1b4fb8}
.ct-it{display:flex;gap:12px;align-items:center;margin:12px 0}
.ct-it img,.ct-it>span{width:56px;height:56px;border-radius:8px;object-fit:cover;background:var(--panel);flex:none}
.ct-l{margin:6px 0 0}.ct-track{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:var(--panel)}
.ct-btn{display:inline-block;margin-top:12px;padding:10px 16px;border-radius:10px;background:var(--ink);color:var(--bg);text-decoration:none;font-weight:600}
.ct-adm{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.ct-adm input{flex:1 1 180px;font:inherit;padding:9px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink)}
.ct-adm button,.ct-del{padding:9px 14px;border:1px solid var(--ink);border-radius:8px;background:none;font-weight:600;cursor:pointer}
.ct-adm button:hover,.ct-del:hover{background:var(--ink);color:var(--bg)}.ct-adm .red,.ct-del{border-color:#d1242f;color:#d1242f}
.ct-adm .red:hover,.ct-del:hover{background:#d1242f;color:#fff}
.ct-h{font-family:var(--font-head);font-size:28px;margin:30px 0 14px}
.ct-stars,.st{color:#f5a623;font-size:22px;letter-spacing:2px}
.ct-pick{display:flex;gap:2px}.st{border:0;background:none;cursor:pointer;padding:2px;letter-spacing:0;font-size:30px}
.ct-ph{display:flex;gap:8px;flex-wrap:wrap}.ct-ph img{width:84px;height:84px;object-fit:cover;border-radius:8px;cursor:zoom-in}
.ct-rev p{margin:8px 0}
.ct-prodrev{max-width:1360px;margin:0 auto;padding-bottom:60px}
.s-cancelado{background:#fde2e2;color:#a11}

/* ---------- avaliação "todas juntas" ---------- */
.ct-ped{margin:0 0 26px;max-width:720px}
.ct-lote{margin:0 0 14px;padding:16px 18px;border:1px dashed var(--ink);border-radius:14px;background:var(--panel)}
.ct-lote p.ct-l{margin:0 0 10px}
.ct-grp .ct-gi{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.ct-grp .ct-gi p{margin:6px 0 0}
.ct-grp .ct-ph{margin:10px 0 0}

/* ---------- menu do topo no iPad e no celular (igual ao do computador, em uma linha própria) ---------- */
@media (max-width:999px){
  .top{row-gap:12px}
  .top-nav{order:4;flex:1 1 100%;justify-content:center;flex-wrap:wrap;gap:4px 24px;padding-top:12px;border-top:1px solid var(--line)}
  .top-link{padding:8px 0}
}
@media (max-width:560px){
  .top-nav{gap:2px 20px}
  .top-link{font-size:14px;padding:9px 0}
  .top-wa{padding:8px 14px}
}

/* ---------- animações ---------- */
@keyframes ctFade{from{opacity:0}to{opacity:1}}
@keyframes ctIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes ctPop{from{opacity:0;transform:translateY(-8px) scale(.97)}to{opacity:1;transform:none}}
@keyframes ctSpin{to{transform:rotate(360deg)}}
@keyframes ctBob{50%{transform:translateY(-4px) scale(1.08)}}
@keyframes ctDot{0%,80%,100%{transform:scale(.4);opacity:.4}40%{transform:scale(1);opacity:1}}
.ct-page{animation:ctFade .4s ease both}
.ct-page .brand-head,.ct-page .ct-tabs{animation:ctIn .5s cubic-bezier(.2,.7,.2,1) both}
.ct-page .ct-tabs{animation-delay:.08s}
.ct-ord,.ct-rev,.ct-ped{animation:ctIn .5s cubic-bezier(.2,.7,.2,1) both}
.ct-pop{transform-origin:top left;animation:ctPop .22s cubic-bezier(.2,.7,.2,1) both}
.ct-pop>*{animation:ctFade .3s ease both}
.ct-pop>:nth-child(2){animation-delay:.04s}.ct-pop>:nth-child(3){animation-delay:.08s}.ct-pop>:nth-child(4){animation-delay:.12s}.ct-pop>:nth-child(5){animation-delay:.16s}
.ct-tabs a{transition:background-color .2s ease,color .2s ease}

/* carregamento ao criar a conta */
.ct-load{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;background:rgba(0,0,0,.45);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:ctFade .25s ease backwards;transition:opacity .25s ease}
.ct-load.sai{opacity:0}
.ct-load-box{width:min(88vw,340px);padding:30px 28px 26px;border-radius:20px;background:var(--bg);color:var(--ink);text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.3);animation:ctIn .4s cubic-bezier(.2,.7,.2,1) backwards}
.ct-load-box b{font-family:var(--font-head);font-size:22px}
.ct-ring{position:relative;display:grid;place-items:center;width:86px;height:86px;margin:0 auto 18px}
.ct-ring::before,.ct-ring::after{content:"";position:absolute;border-radius:50%;border:4px solid transparent}
.ct-ring::before{inset:0;border-color:var(--line);border-top-color:var(--ink);animation:ctSpin .9s linear infinite}
.ct-ring::after{inset:10px;border-width:3px;border-bottom-color:#2f6bff;animation:ctSpin 1.4s linear infinite reverse}
.ct-ring svg{width:28px;height:28px;animation:ctBob 1.6s ease-in-out infinite}
.ct-load-p{min-height:2.8em;margin:8px 0 12px;color:var(--muted);font-size:14px}
.ct-dots i{display:inline-block;width:8px;height:8px;margin:0 3px;border-radius:50%;background:var(--ink);animation:ctDot 1.1s ease-in-out infinite both}
.ct-dots i:nth-child(2){animation-delay:.15s}.ct-dots i:nth-child(3){animation-delay:.3s}
@media (prefers-reduced-motion:reduce){
  .ct-page,.ct-page .brand-head,.ct-page .ct-tabs,.ct-ord,.ct-rev,.ct-ped,.ct-pop,.ct-pop>*,.ct-load,.ct-load-box,.ct-ring svg,.ct-dots i{animation:none}
  .ct-ring::before,.ct-ring::after{animation-duration:3s}
}

/* ---------- sublinha única: uma linha que desliza entre as abas e some de fora pra dentro ---------- */
.nav-ind{display:none}
.ct-line{position:absolute;left:0;top:0;height:2px;pointer-events:none;transition:transform .34s cubic-bezier(.6,0,.2,1),width .34s cubic-bezier(.6,0,.2,1)}
.ct-line::after{content:"";display:block;height:100%;border-radius:2px;background:currentColor;transform:scaleX(0);transform-origin:center;transition:transform .3s cubic-bezier(.6,0,.2,1)}
.ct-line.on::after{transform:scaleX(1)}
.ct-line.semanim{transition:none}
.top-link[aria-current=page]{-webkit-text-stroke:.35px currentColor}
.ct-utabs{position:relative}

/* ---------- abas do painel restrito ---------- */
.ct-utabs{display:flex;flex-wrap:wrap;gap:4px 28px;margin:0 0 24px;border-bottom:1px solid var(--line)}
/* aba ativa = texto cheio; as outras ficam mais claras */
.ct-utabs button{border:0;background:none;color:var(--ink);font:inherit;font-weight:600;font-size:16px;padding:10px 0 12px;cursor:pointer;opacity:.6;transition:opacity .2s ease}
.ct-utabs button.on,.ct-utabs button:hover,.ct-utabs button:focus-visible{opacity:1}
.ct-utabs small{margin-left:4px;font-size:12px;font-weight:600;color:var(--muted)}
.ct-panel{min-height:120px}
@keyframes ctOutF{to{opacity:0;transform:translateX(-24px)}}
@keyframes ctOutB{to{opacity:0;transform:translateX(24px)}}
@keyframes ctInF{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes ctInB{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
.ct-panel.sai-f{animation:ctOutF .16s ease forwards}.ct-panel.sai-b{animation:ctOutB .16s ease forwards}
.ct-panel.in-f{animation:ctInF .35s cubic-bezier(.2,.7,.2,1) both}.ct-panel.in-b{animation:ctInB .35s cubic-bezier(.2,.7,.2,1) both}
.ct-panel.in-f .ct-ord,.ct-panel.in-f .ct-rev,.ct-panel.in-b .ct-ord,.ct-panel.in-b .ct-rev{animation:none}
.ct-panel.quieto .ct-ord,.ct-panel.quieto .ct-rev{animation:none}
.ct-adm input[hidden],.ct-adm button[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.ct-panel,.ct-panel.sai-f,.ct-panel.sai-b,.ct-panel.in-f,.ct-panel.in-b{animation:none}.ct-line,.ct-line::after{transition:none}}

/* celular: ícones (favoritos, carrinho, modo escuro) na linha do logo */
.top-icons{display:flex;align-items:center;gap:2px;margin-left:auto}
.top-icons .top-fav{margin-right:0}
.top-icons .tema{margin-left:6px}

/* fotos das avaliações: indicam que dá para ampliar */
.ct-ph img{transition:transform .2s ease,box-shadow .2s ease}
@media (hover:hover){.ct-ph img:hover{transform:scale(1.06);box-shadow:0 6px 18px rgba(0,0,0,.25)}}

/* "Não avaliar este produto" */
.ct-skip{justify-self:start;padding:8px 14px;border:1px solid var(--line);border-radius:8px;background:none;color:var(--muted);font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:border-color .2s,color .2s}
.ct-skip:hover{border-color:var(--ink);color:var(--ink)}
.rf{transition:opacity .25s ease}
.rf.pulado>*:not(.ct-skip){opacity:.45}

/* ---------- cupons ---------- */
/* caixa de cupom (carrinho e página do produto) */
.cup-box{margin:14px 0 4px}
.cup-form{display:flex;gap:8px}
.cup-form input{flex:1 1 auto;min-width:0;font:inherit;font-size:16px;padding:11px 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink);text-transform:uppercase}
.cup-form input::placeholder{text-transform:none}
.cup-form input:focus{border-color:var(--ink);outline:none}
.cup-form button{flex:none;padding:0 18px;border:1px solid var(--ink);border-radius:10px;background:none;color:var(--ink);font:inherit;font-weight:600;cursor:pointer;transition:background-color .2s,color .2s}
.cup-form button:hover{background:var(--ink);color:var(--bg)}
.cup-box .ct-err{margin:8px 0 0}
.cup-meus{display:inline-block;margin:10px 0 0;padding:0;border:0;background:none;color:#2f6bff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.cup-on{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 14px;border:1px dashed var(--ink);border-radius:10px;background:var(--panel);animation:ctFade .3s ease both}
.cup-on small{color:var(--muted);font-size:13px}
.cup-on button{flex:none;padding:7px 12px;border:1px solid #d1242f;border-radius:8px;background:none;color:#d1242f;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.cup-on button:hover{background:#d1242f;color:#fff}
.cup-tot{margin:10px 0 0;font-size:15px}.cup-tot s{color:var(--muted)}
/* pop-up "Meus cupons" (mesmo visual do pop-up da conta) */
.ct-pop.cup-pop{width:min(340px,calc(100vw - 16px));max-height:min(420px,70vh);overflow:auto}
.cup-pop button b{font-family:var(--font-head);font-size:19px;letter-spacing:.03em}
.cup-pop small{display:block;margin-top:2px;font-weight:400;font-size:12.5px;color:var(--muted)}
.cup-pop button:disabled{opacity:.5;cursor:not-allowed}
.cup-pop button:disabled:hover{background:none}
.cup-pop a{color:#2f6bff}
/* cartões de cupom (conta e painel) */
.cup-card.off{opacity:.7}
.cup-card .ct-l b{font-size:17px}
.cup-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.cup-act button{padding:9px 14px;border:1px solid var(--ink);border-radius:8px;background:none;color:var(--ink);font:inherit;font-weight:600;cursor:pointer}
.cup-act button:hover{background:var(--ink);color:var(--bg)}
.cup-act .red{border-color:#d1242f;color:#d1242f}.cup-act .red:hover{background:#d1242f;color:#fff}
/* formulário de novo cupom (painel restrito) */
.cup-form-adm{max-width:720px;margin:0 0 8px}
.cup-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 0 14px}
.cup-grid label{display:grid;gap:6px;font-weight:600;font-size:14px;align-content:start}
.cup-grid label[hidden]{display:none}
.cup-grid input,.cup-grid select{width:100%;font:inherit;font-size:16px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--ink)}
.cup-grid input:focus,.cup-grid select:focus{border-color:var(--ink);outline:none}
.cup-grid input[name=codigo]{text-transform:uppercase}
.cup-grid input[name=codigo]::placeholder{text-transform:none}
.cup-form-adm .ct-err{margin:0 0 12px}
.cup-form-adm .cart-add{max-width:260px}
@media (max-width:560px){.cup-grid{grid-template-columns:1fr}}

/* ---------- carrinho abrindo (depois do botão "Comprar") ---------- */
@keyframes ctCartOpen{from{opacity:0;transform:translateY(34px) scale(.965);filter:blur(6px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes ctCartItem{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
@keyframes ctCartSum{from{opacity:0;transform:translateX(32px) scale(.96)}to{opacity:1;transform:none}}
@keyframes ctCartBtn{0%{box-shadow:0 0 0 0 rgba(37,211,102,.55)}100%{box-shadow:0 0 0 18px rgba(37,211,102,0)}}
.cart-abre{transform-origin:50% 0;animation:ctCartOpen .6s cubic-bezier(.2,.7,.2,1) both}
.cart-abre .cart-all,.cart-abre .ci{animation:ctCartItem .5s cubic-bezier(.2,.7,.2,1) both}
.cart-abre .cart-all{animation-delay:.2s}
.cart-abre .ci:nth-child(2){animation-delay:.28s}.cart-abre .ci:nth-child(3){animation-delay:.36s}.cart-abre .ci:nth-child(4){animation-delay:.44s}.cart-abre .ci:nth-child(n+5){animation-delay:.5s}
.cart-abre .cart-sum{animation:ctCartSum .55s cubic-bezier(.2,.7,.2,1) .3s both}
.cart-abre #cartFinal{animation:ctCartBtn 1.1s ease-out .9s 1 both}
@media (prefers-reduced-motion:reduce){.cart-abre,.cart-abre .cart-all,.cart-abre .ci,.cart-abre .cart-sum,.cart-abre #cartFinal{animation:none}}
