/* ==========================================================================
   Jacob Milhas · Camada de acabamento (linguagem Apple)
   Carregada DEPOIS de estilo.css (e do <style> da Gestão). Não muda a marca:
   cores Noite/Azul/Céu/Aurora e a Escada de Jacó continuam. Refina:
   materiais translúcidos, profundidade em camadas, tipografia por tamanho,
   resposta imediata ao toque e movimento contínuo e interrompível.
   ========================================================================== */
:root{
  /* Curvas: "mola" sem quique (padrão) e a curva de folha do iOS */
  --mola:cubic-bezier(.25,1,.5,1);
  --folha:cubic-bezier(.32,.72,0,1);
  /* Profundidade: uma borda finíssima + sombra difusa, em vez de bordas fortes */
  --fio:rgba(2,51,102,.08);
  --fio-forte:rgba(2,51,102,.14);
  --sombra-1:0 0 0 .5px rgba(2,51,102,.06),0 1px 2px rgba(2,51,102,.04),0 4px 14px rgba(2,51,102,.05);
  --sombra-2:0 0 0 .5px rgba(2,51,102,.07),0 2px 6px rgba(2,51,102,.05),0 16px 40px rgba(2,51,102,.09);
  --sombra-3:0 0 0 .5px rgba(2,51,102,.08),0 8px 20px rgba(2,51,102,.08),0 32px 80px rgba(2,51,102,.16);
  --shadow:var(--sombra-1);
  --campo:rgba(2,51,102,.035);
  --campo-hover:rgba(2,51,102,.055);
  --anel:0 0 0 4px rgba(0,102,255,.16);
  --material:rgba(251,248,242,.84);
  --r:18px;
}

/* ---------- Tipografia: tracking e entrelinha conforme o tamanho ---------- */
body{font-size:15px;line-height:1.55;letter-spacing:-.003em;text-rendering:optimizeLegibility;font-feature-settings:"cv11","ss01"}
h1{letter-spacing:-.035em;line-height:1.04}
h2{letter-spacing:-.028em;line-height:1.1}
h3{letter-spacing:-.018em;line-height:1.2}
.hero h1{font-size:clamp(36px,5.2vw,56px);font-weight:800}
.rotulo,.stub-lbl,.kpi span,th,label.f,.f-lbl,.contatos .c-lbl,.dica .cat,.db-aviso{letter-spacing:.1em}
label.f,.f-lbl{font-size:11px;color:#6A7A90}
.muted{color:#66758B}
.hora,.t,.stub-preco,.kpi b,.db-tot b{letter-spacing:-.03em;font-feature-settings:"tnum"}

/* ---------- Barra superior: material translúcido, borda só ao rolar ---------- */
.top{background:var(--material);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);border-bottom:0;box-shadow:0 1px 0 transparent;transition:box-shadow .3s var(--mola),background .3s var(--mola)}
:root[data-rolou] .top{box-shadow:0 1px 0 var(--fio),0 8px 24px -12px rgba(2,51,102,.14)}
/* Navegação como controle segmentado */
.nav{gap:2px;padding:3px;border-radius:999px;background:rgba(2,51,102,.05)}
.nav button{padding:7px 15px;font-weight:600;font-size:14px;color:#4A5D78;transition:color .15s,background .2s var(--mola),box-shadow .2s var(--mola),transform .1s ease-out}
.nav button:hover{color:var(--noite)}
.nav button[aria-current="page"]{background:var(--branco);color:var(--noite);box-shadow:0 1px 2px rgba(2,51,102,.1),0 2px 8px rgba(2,51,102,.07)}
.nav-ext{border:0;background:rgba(2,51,102,.05)}
@media (max-width:640px){.nav{background:none;padding:0}.nav button[aria-current="page"]{background:rgba(2,51,102,.06);box-shadow:none}}
.demo-flag{background:linear-gradient(90deg,var(--aurora-leve),#FDF6EA);border-bottom:0;font-weight:600;letter-spacing:0}

/* ---------- Superfícies: cartões com profundidade suave ---------- */
.card,.kpi,.voo,.best,.bn{border-color:var(--fio)}
.card{border-radius:var(--r);box-shadow:var(--sombra-1)}
.search{border-radius:24px;box-shadow:var(--sombra-2);padding:22px}
.login{border-radius:24px;box-shadow:var(--sombra-3);border-color:transparent}

/* ---------- Resposta imediata: realce no toque, não no soltar ---------- */
.btn,.chip,.nav button,.tipo-viagem button,.swap,.step button,.tr-del,.mural-nav button,.adm-nav button,.best button,.lnk,.bn-btn,.stub-btn{
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  transition:transform .1s ease-out,background-color .2s var(--mola),border-color .2s var(--mola),color .15s,box-shadow .2s var(--mola),opacity .15s}
.btn:active:not(:disabled),.chip:active,.swap:active,.step button:active,.tr-del:active:not(:disabled),.mural-nav button:active,.bn-btn:active{transform:scale(.97)}
.nav button:active,.tipo-viagem button:active,.adm-nav button:active,.best button:active{transform:scale(.98)}
.lnk:active{opacity:.6}

/* Botões */
.btn{min-height:44px;padding:11px 20px;font-weight:650;letter-spacing:-.005em;border-color:var(--fio-forte)}
.btn.sm{min-height:34px;padding:7px 14px}
.btn:hover{border-color:var(--d3);background:#FDFCFA}
.btn.primary{background:var(--azul-link);border-color:transparent;box-shadow:0 1px 2px rgba(0,82,204,.25),inset 0 1px 0 rgba(255,255,255,.14)}
.btn.primary:hover{background:#005EEB;border-color:transparent}
.btn.brand{border-color:transparent;box-shadow:0 1px 2px rgba(2,51,102,.25),inset 0 1px 0 rgba(255,255,255,.08)}
.btn.ghost{border-color:transparent}
.btn.ghost:hover{background:rgba(0,82,204,.06)}
.swap{border-color:var(--fio-forte);box-shadow:var(--sombra-1)}

/* Campos preenchidos, foco com anel suave */
.inp{background:var(--campo);border-color:transparent;border-radius:12px;transition:background .2s var(--mola),border-color .2s var(--mola),box-shadow .2s var(--mola)}
.inp:hover{background:var(--campo-hover)}
.inp:focus{background:var(--branco);border-color:rgba(0,102,255,.55);box-shadow:var(--anel)}
.step{background:var(--campo);border-color:transparent;border-radius:12px}
.step button{background:var(--branco);box-shadow:0 1px 2px rgba(2,51,102,.1),0 0 0 .5px rgba(2,51,102,.08)}
.tr-del{background:var(--campo);border-color:transparent;border-radius:12px}
td .inp{background:var(--campo)}

/* Chips, tags, controles segmentados */
.chip{border-color:var(--fio-forte);font-weight:600}
.chip:hover{border-color:var(--d3)}
.chip[aria-pressed="true"]{box-shadow:0 1px 2px rgba(2,51,102,.25)}
.tipo-viagem{background:rgba(2,51,102,.05);padding:3px}
.tipo-viagem button{transition:background .25s var(--mola),box-shadow .25s var(--mola),color .15s,transform .1s ease-out}
.tipo-viagem button[aria-checked="true"]{box-shadow:0 1px 2px rgba(2,51,102,.1),0 3px 10px rgba(2,51,102,.08)}
.ac-list{border:0;border-radius:14px;box-shadow:var(--sombra-3);padding:4px;-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);background:rgba(255,255,255,.9);transform-origin:top center}
.ac-list button{border-radius:9px}
.toggle input{transition:background .25s var(--mola)}
.toggle input::after{transition:transform .3s var(--mola);box-shadow:0 2px 4px rgba(0,0,0,.18),0 0 0 .5px rgba(0,0,0,.04)}

/* ---------- Cartão de voo ---------- */
.voo{border-radius:22px;box-shadow:var(--sombra-1);transition:box-shadow .3s var(--mola),transform .3s var(--mola),border-color .2s}
.voo:hover{transform:translateY(-2px);box-shadow:var(--sombra-2);border-color:var(--fio)}
.voo.sel{border-color:var(--azul);box-shadow:0 0 0 1.5px var(--azul),var(--sombra-2)}
.voo-stub{border-radius:0 22px 22px 0;background:linear-gradient(180deg,#FFFFFF 0%,#F8F5EE 100%)}
.voo-stub::before,.voo-stub::after{border-color:var(--fio)}
.stub-preco{font-weight:800}
.cia-logo{border-color:var(--fio);box-shadow:0 1px 2px rgba(2,51,102,.04)}
.detalhe{border-radius:18px;background:rgba(188,224,241,.32)}
.best{box-shadow:var(--sombra-1);border-radius:18px;margin-bottom:14px}
.filtros{border-radius:18px}
.best button{transition:background .25s var(--mola),color .2s}
@media (max-width:760px){.voo-stub{border-radius:0 0 22px 22px}.voo:hover{transform:none}}

/* ---------- Folhas, gavetas e sobreposições: escurecer para focar ---------- */
.sheet,.drawer,.email-ov{background:rgba(2,26,51,.28);-webkit-backdrop-filter:blur(6px) saturate(120%);backdrop-filter:blur(6px) saturate(120%)}
.sheet.entra,.drawer.entra,.email-ov.entra{animation:esmaece .28s ease-out}
.sheet>.card{border-radius:26px 26px 0 0;box-shadow:var(--sombra-3);border:0}
.sheet.entra>.card{animation:sobeFolha .5s var(--folha)}
.sheet>.card::before{content:"";display:block;width:38px;height:5px;border-radius:999px;background:rgba(2,51,102,.16);margin:-10px auto 14px}
.drawer>div{box-shadow:-1px 0 0 var(--fio),-24px 0 60px rgba(2,51,102,.16)}
.drawer.entra>div{animation:entraLado .5s var(--folha)}
.email-box{border-radius:22px;box-shadow:var(--sombra-3)}
.email-ov.entra .email-box{animation:surge .35s var(--mola)}
.prop-bar{background:var(--material);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);border-bottom:0;box-shadow:0 1px 0 var(--fio)}
.folha-escala{border-radius:8px;box-shadow:var(--sombra-3)}

/* Barra de cotação e aviso: material escuro translúcido */
.cart{background:rgba(2,51,102,.86);-webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);box-shadow:0 -1px 0 rgba(255,255,255,.08) inset,0 -10px 30px rgba(2,51,102,.18)}
.cart.entra{animation:sobeFolha .45s var(--folha)}
.toast{background:rgba(2,51,102,.88);-webkit-backdrop-filter:blur(20px) saturate(160%);backdrop-filter:blur(20px) saturate(160%);box-shadow:var(--sombra-2);animation:toastIn .4s var(--mola)}
.timer{border-color:var(--fio);box-shadow:var(--sombra-1)}

@keyframes esmaece{from{opacity:0}to{opacity:1}}
@keyframes sobeFolha{from{transform:translateY(100%)}to{transform:none}}
@keyframes entraLado{from{transform:translateX(100%)}to{transform:none}}
@keyframes surge{from{opacity:0;transform:scale(.96) translateY(-4px)}to{opacity:1;transform:none}}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,12px) scale(.96)}to{opacity:1;transform:translate(-50%,0)}}

/* ---------- Escada de Jacó: mantida, com acabamento mais macio ---------- */
.degraus{gap:4px}
.degraus i{border-radius:4px 4px 1px 1px;transform-origin:bottom}
.degraus.entra i{animation:sobe .7s var(--mola) both}
.degraus.entra i:nth-child(2){animation-delay:.05s}.degraus.entra i:nth-child(3){animation-delay:.1s}.degraus.entra i:nth-child(4){animation-delay:.15s}.degraus.entra i:nth-child(5){animation-delay:.2s}
.escada{gap:6px;padding-inline:6px}
.escada i{border-radius:14px 14px 0 0;animation-timing-function:var(--mola)}
.bn-degraus i{border-radius:8px 8px 0 0}
.login .lema{letter-spacing:-.02em}
.mural-top .board{border-color:var(--fio);box-shadow:var(--sombra-1)}
.mural-nav button{border-color:var(--fio);box-shadow:var(--sombra-1)}

/* ---------- Banners ---------- */
.bn{border-radius:24px;box-shadow:var(--sombra-2)}

/* ---------- Tabelas ---------- */
th,td{border-bottom-color:var(--fio)}
th{color:#6A7A90}
tbody tr{transition:background .15s}
tbody tr:hover{background:rgba(2,51,102,.02)}

/* ---------- Gestão (seletores mais específicos que o <style> da página) ---------- */
.adm .adm-side{background:linear-gradient(180deg,#023366 0%,#012A55 100%);box-shadow:inset -1px 0 0 rgba(255,255,255,.04)}
.adm .adm-nav{gap:3px}
.adm .adm-nav button{font-weight:600;border-radius:12px;padding:10px 12px}
.adm .adm-nav button:hover{background:rgba(188,224,241,.1)}
.adm .adm-nav button[aria-current="page"]{background:rgba(255,255,255,.96);color:var(--noite);box-shadow:0 1px 2px rgba(0,0,0,.18),0 6px 18px rgba(0,0,0,.14)}
.adm .adm-head h1{font-size:44px}
.adm .kpi{border-color:var(--fio);border-radius:20px;box-shadow:var(--sombra-1);padding:18px 20px;transition:box-shadow .3s var(--mola),transform .3s var(--mola)}
.adm .kpi:hover{box-shadow:var(--sombra-2);transform:translateY(-1px)}
.adm .kpi.alerta{border-color:rgba(243,217,177,.9);background:linear-gradient(180deg,#FCF3E4,#FBEEDB)}
.adm .kpi b{font-weight:800}
.adm .db-alerta{border-color:rgba(235,203,149,.7);background:linear-gradient(180deg,#FCF1DE,#FAEBD2)}
.adm .db-bar{fill:#3A6DB0;transition:fill .15s}
.adm .db-hit.on{fill:rgba(2,51,102,.05)}
.adm .db-tip{border-radius:12px;background:rgba(2,51,102,.92);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--sombra-2)}
.adm .rank-bar{background:rgba(2,51,102,.07)}
.adm .meter{background:rgba(2,51,102,.07)}
.adm .lin-ped{border-bottom-color:var(--fio);border-radius:0;transition:background .15s}
.adm .lin-ped:hover{background:rgba(2,51,102,.02)}
.adm .drawer>div{background:#FBF9F5}
.adm .novo-ped{border-radius:16px;box-shadow:var(--sombra-3)}

/* ---------- Acessibilidade: movimento, transparência, contraste ---------- */
@media (prefers-reduced-motion:reduce){
  .voo:hover,.adm .kpi:hover{transform:none}
  .entra,.entra>*,.entra .email-box,.toast,.degraus i,.escada i{animation:esmaece .2s ease both!important}
}
@media (prefers-reduced-transparency:reduce){
  .top,.prop-bar{background:var(--marfim);backdrop-filter:none;-webkit-backdrop-filter:none}
  .cart,.toast{background:var(--noite);backdrop-filter:none;-webkit-backdrop-filter:none}
  .sheet,.drawer,.email-ov{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(2,26,51,.45)}
  .ac-list{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media (prefers-contrast:more){
  :root{--fio:rgba(2,51,102,.4);--fio-forte:rgba(2,51,102,.55);--campo:#fff}
  .inp,.step,.tr-del{border-color:var(--fio-forte)}
  .top{background:var(--marfim);box-shadow:0 1px 0 var(--fio)}
}

/* Pix com valor (QR Code + Copia e Cola) */
.pix-box{margin:14px auto 4px;max-width:360px;padding:16px;border:1px solid var(--linha,#dfe3ea);border-radius:14px;background:var(--cartao,#fff);display:flex;flex-direction:column;gap:10px;text-align:left}
.pix-cab{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.pix-cab strong{font-size:1.05rem}
.pix-cab .num{font-size:1.25rem;font-weight:700}
.pix-qr{background:#fff;border-radius:10px;padding:8px;align-self:center;width:220px;max-width:100%}
.pix-qr svg{display:block;width:100%;height:auto}
.pix-ajuda{font-size:.85rem;margin:0}
.pix-codigo{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.75rem;word-break:break-all;resize:none;min-height:84px}

/* Copiar dado a dado (Gestão › pedido) */
.cp-barra{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.cp-barra .muted{font-size:12.5px}
.cp{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:5px;border-radius:6px;padding:1px 4px;margin:-1px -4px;transition:background .15s}
.cp svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8;opacity:.35;flex:none}
.cp:hover,.cp:focus-visible{background:var(--azul-claro,#e6f0fb)}
.cp:hover svg,.cp:focus-visible svg{opacity:.9}
.cp:focus-visible{outline:2px solid var(--azul-link,#1a5fd0);outline-offset:1px}
.cp.cp-ok{background:#dff5e6}
.cp-mini{all:unset;cursor:pointer;font-size:11.5px;font-weight:600;color:var(--azul-link,#1a5fd0);margin-left:8px;letter-spacing:0;text-transform:none}
.cp-mini:hover{text-decoration:underline}
