html,body{margin:0;min-height:100%;background:#f4f6fa}body{padding:0}#tti-packages{max-width:none;margin:0;border:0;border-radius:0}
#tti-packages .tti-logo{display:block;width:72px;height:72px}
@media(max-width:480px){#tti-packages .tti-logo{width:56px;height:56px}}
/* Itens clicaveis que o layout original deixava como texto puro: viram botoes de fundo azul-claro */
#tti-packages .tti-nav button,
#tti-packages td button,
#tti-packages .tti-file a{background:#eaf0ff;border:1px solid #c4d5ff;border-radius:9px;color:var(--tti-blue);font-weight:600}
#tti-packages .tti-nav button:hover,
#tti-packages td button:hover,
#tti-packages .tti-file a:hover{background:#dbe6ff;border-color:#9fb7f3}
#tti-packages .tti-nav button{padding:8px 16px}
#tti-packages td button{padding:4px 10px}
#tti-packages .tti-file a{padding:0 14px;text-decoration:none}
/* ===== Modo balcao (PDV): ocupa a tela toda, alvos grandes ===== */
#tti-packages{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;font-size:clamp(16px,1.15vw,20px)}
#tti-packages .tti-top{padding:14px clamp(16px,2.2vw,40px)}
#tti-packages .tti-nav{padding:10px clamp(16px,2.2vw,40px)}
#tti-packages .tti-main{flex:1;display:flex;flex-direction:column;padding:clamp(16px,2.2vw,40px)}
#tti-packages .tti-footer{padding:10px clamp(16px,2.2vw,40px)}
#tti-packages h1{font-size:clamp(28px,2.8vw,44px)}
#tti-packages .tti-eyebrow{font-size:clamp(12px,.95vw,15px)}
#tti-packages .tti-heading p{font-size:clamp(15px,1.2vw,20px)}
#tti-packages button{min-height:clamp(48px,4.2vw,64px);font-size:clamp(15px,1.2vw,20px)}
#tti-packages input,#tti-packages select{min-height:clamp(48px,4.2vw,64px);font-size:clamp(16px,1.2vw,20px)}
#tti-packages svg{width:clamp(20px,1.6vw,26px);height:clamp(20px,1.6vw,26px)}
#tti-packages .tti-logo{width:clamp(56px,5vw,84px);height:clamp(56px,5vw,84px)}
/* Tela de inicio: cards enormes ocupando toda a area */
#tti-packages .tti-choices{flex:1;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:minmax(160px,1fr);gap:clamp(12px,1.4vw,24px)}
#tti-packages .tti-choices .tti-mode:nth-child(-n+3){grid-column:span 2}
#tti-packages .tti-choices .tti-mode:nth-child(n+4){grid-column:span 3}
#tti-packages .tti-mode{min-height:0;justify-content:center;padding:clamp(20px,2.4vw,44px);gap:10px}
#tti-packages .tti-mode strong{font-size:clamp(26px,3vw,48px);letter-spacing:-1px}
#tti-packages .tti-mode span{font-size:clamp(14px,1.3vw,22px)}
#tti-packages .tti-mode svg{width:clamp(32px,3.6vw,60px);height:clamp(32px,3.6vw,60px);margin-bottom:clamp(6px,1vw,18px)}
/* Telas de trabalho */
#tti-packages .tti-work{flex:1;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(14px,1.6vw,28px);align-items:stretch}
#tti-packages .tti-panel{padding:clamp(18px,1.8vw,34px)}
#tti-packages h2{font-size:clamp(19px,1.7vw,28px)}
#tti-packages .tti-scan{font-size:clamp(20px,2vw,34px);min-height:clamp(64px,6vw,96px)}
#tti-packages .tti-form-row button{padding:10px clamp(16px,2vw,36px)}
#tti-packages .tti-help{font-size:clamp(12px,.95vw,16px)}
#tti-packages .tti-result{min-height:clamp(180px,26vh,340px);padding:clamp(20px,2vw,36px)}
#tti-packages .tti-result h2{font-size:clamp(26px,2.8vw,46px)}
#tti-packages .tti-result .tti-code{font-size:clamp(20px,2vw,32px)}
#tti-packages .tti-timeline strong{font-size:clamp(14px,1.2vw,19px)}
#tti-packages .tti-timeline small{font-size:clamp(12px,1vw,16px)}
#tti-packages .tti-hist-code{font-size:clamp(14px,1.1vw,18px)}
/* Busca */
#tti-packages .tti-stat strong{font-size:clamp(36px,3.6vw,60px)}
#tti-packages .tti-stat small{font-size:clamp(13px,1.05vw,17px)}
#tti-packages .tti-filters label{font-size:clamp(13px,1vw,16px)}
#tti-packages table{font-size:clamp(13px,1.1vw,18px)}
@media(max-width:1000px){
#tti-packages .tti-work{grid-template-columns:1fr}
}
@media(max-width:760px){
#tti-packages .tti-choices{grid-template-columns:1fr 1fr}
#tti-packages .tti-choices .tti-mode:nth-child(n){grid-column:auto}
#tti-packages .tti-choices .tti-mode:last-child{grid-column:1/-1}
}
@media(max-width:480px){
#tti-packages .tti-choices{grid-template-columns:1fr}
#tti-packages .tti-choices .tti-mode:last-child{grid-column:auto}
#tti-packages .tti-choices{grid-auto-rows:minmax(110px,auto)}
}
/* ===== Sem rolagem: a pagina tem sempre a altura da tela; tamanhos seguem a menor dimensao ===== */
html,body{height:100%;overflow:hidden}
#tti-packages{height:100vh;height:100dvh;min-height:0}
#tti-packages .tti-main{min-height:0;overflow:auto;padding:min(2.2vw,3.2vh) clamp(16px,2.2vw,40px)}
#tti-packages .tti-top{padding:min(1.4vh,14px) clamp(16px,2.2vw,40px)}
#tti-packages .tti-logo{width:clamp(44px,min(5vw,9vh),84px);height:clamp(44px,min(5vw,9vh),84px)}
#tti-packages .tti-nav{padding:min(1vh,10px) clamp(16px,2.2vw,40px)}
#tti-packages .tti-footer{padding:min(1vh,10px) clamp(16px,2.2vw,40px)}
#tti-packages h1{font-size:clamp(24px,min(2.8vw,5vh),44px);margin:2px 0 4px}
#tti-packages .tti-heading{margin-bottom:min(2.4vw,3vh)}
#tti-packages button,#tti-packages input,#tti-packages select{min-height:clamp(46px,min(4.2vw,7.5vh),64px)}
#tti-packages .tti-choices{grid-auto-rows:minmax(0,1fr);min-height:0}
#tti-packages .tti-mode{padding:min(2.4vw,3.6vh);gap:min(.8vh,10px);overflow:hidden}
#tti-packages .tti-mode strong{font-size:clamp(22px,min(3vw,5.6vh),48px)}
#tti-packages .tti-mode span{font-size:clamp(13px,min(1.3vw,2.4vh),22px)}
#tti-packages .tti-mode svg{width:clamp(28px,min(3.6vw,6.5vh),60px);height:clamp(28px,min(3.6vw,6.5vh),60px);margin-bottom:min(1vw,1.6vh)}
#tti-packages .tti-work{min-height:0}
#tti-packages .tti-panel{min-height:0;padding:min(1.8vw,3vh)}
#tti-packages .tti-work aside{overflow:auto}
#tti-packages .tti-scan{min-height:clamp(52px,min(6vw,10vh),96px);font-size:clamp(18px,min(2vw,3.6vh),34px)}
#tti-packages .tti-result{min-height:min(26vh,300px);padding:min(2vw,3vh)}
#tti-packages .tti-result h2{font-size:clamp(22px,min(2.8vw,5vh),46px)}
@media(max-width:480px){#tti-packages .tti-choices{grid-auto-rows:minmax(0,1fr)}}
/* ===== Busca: barra de filtros no topo, lista ocupando o resto, sem rolagem de pagina ===== */
#tti-packages .tti-main{position:relative}
#tti-packages .tti-chips{display:flex;gap:10px;flex-wrap:wrap}
#tti-packages .tti-chip{display:flex;align-items:baseline;gap:10px;background:#fff;border:1px solid var(--tti-line);border-radius:12px;padding:10px min(1.4vw,20px);white-space:nowrap}
#tti-packages .tti-chip strong{font-size:clamp(26px,min(2.4vw,4.4vh),40px);letter-spacing:-1px;line-height:1.1}
#tti-packages .tti-chip span{color:var(--tti-muted);font-size:clamp(12px,min(1vw,1.9vh),16px)}
#tti-packages .tti-chip.tti-attention{border-left:4px solid #ddb327}
#tti-packages .tti-board{flex:1;min-height:0;display:flex;flex-direction:column;gap:min(1.4vw,2vh)}
#tti-packages .tti-toolbar{display:grid;grid-template-columns:minmax(260px,1.6fr) repeat(3,minmax(130px,1fr)) auto;gap:min(1.2vw,16px);align-items:end;flex:0 0 auto}
#tti-packages .tti-toolbar .tti-tool{font-size:clamp(12px,min(1vw,1.9vh),15px);min-width:0}
#tti-packages .tti-toolbar .tti-tool input,#tti-packages .tti-toolbar .tti-tool select{margin-top:6px}
#tti-packages .tti-toolbar .tti-tool-code .tti-form-row{margin-top:6px}
#tti-packages .tti-toolbar .tti-check{display:flex;align-items:center;gap:8px;white-space:nowrap;margin-bottom:12px}
#tti-packages .tti-toolbar .tti-check input{margin-top:0;width:22px;height:22px;min-height:22px}
#tti-packages .tti-results{flex:1;min-height:0;display:flex;flex-direction:column}
#tti-packages .tti-results .tti-section-head{flex:0 0 auto;margin-bottom:min(1.2vh,14px)}
#tti-packages .tti-head-actions{display:flex;gap:10px;flex-wrap:wrap}
#tti-packages .tti-scrollarea{flex:1;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch}
#tti-packages .tti-results thead th{position:sticky;top:0;z-index:1}
#tti-packages .tti-results td{padding:min(1.2vh,14px) 8px}
/* Histórico e arquivos abrem por cima, sem empurrar a tela */
#tti-packages .tti-overlay{position:absolute;inset:0;z-index:20;background:rgba(16,29,57,.5);display:flex;align-items:center;justify-content:center;padding:min(3vw,4vh)}
#tti-packages .tti-overlay-card{background:#fff;border-radius:14px;box-shadow:0 18px 50px rgba(9,20,45,.3);width:min(860px,100%);max-height:100%;display:flex;flex-direction:column;padding:min(2vw,3.2vh)}
#tti-packages .tti-overlay-card .tti-section-head{flex:0 0 auto}
#tti-packages .tti-overlay-card .tti-scrollarea{padding-right:4px}
#tti-packages .tti-overlay-card input[type=file]{margin-bottom:10px}
@media(max-width:1000px){
#tti-packages .tti-toolbar{grid-template-columns:1fr 1fr;align-items:end}
#tti-packages .tti-toolbar .tti-tool-code{grid-column:1/-1}
}
@media(max-width:600px){
#tti-packages .tti-toolbar{grid-template-columns:1fr}
#tti-packages .tti-chip strong{font-size:26px}
#tti-packages .tti-overlay{padding:0}
#tti-packages .tti-overlay-card{border-radius:0;height:100%}
}
/* Busca em telas baixas: cabecalho enxuto para sobrar altura para a lista */
#tti-packages .tti-search-mode .tti-toolbar{padding:min(1.2vw,2vh) min(1.8vw,3vh)}
#tti-packages .tti-search-mode .tti-results{padding:min(1.4vw,2.2vh) min(1.8vw,3vh) min(1vw,1.6vh)}
@media(max-height:860px){
#tti-packages .tti-search-mode .tti-heading{margin-bottom:min(1.2vh,12px)}
#tti-packages .tti-search-mode .tti-heading p{display:none}
#tti-packages .tti-search-mode .tti-results td{padding:min(1vh,12px) 8px}
}
/* No celular a tela rola normalmente: nada de lista espremida dentro de outra rolagem */
@media(max-width:600px){
#tti-packages .tti-board{display:block}
#tti-packages .tti-toolbar{margin-bottom:12px}
#tti-packages .tti-results{display:block}
#tti-packages .tti-scrollarea{overflow:visible;flex:none;min-height:0}
#tti-packages .tti-overlay-card .tti-scrollarea{overflow:auto;flex:1}
#tti-packages .tti-chips{width:100%}
#tti-packages .tti-chip{flex:1;justify-content:center}
}
/* ===== Pop-up vermelho de bipagem recusada ===== */
#tti-packages .tti-alert-card{width:min(720px,100%);padding:0;overflow:hidden;border-top:0}
#tti-packages .tti-alert-head{display:flex;align-items:center;gap:14px;background:#b3192a;color:#fff;padding:min(1.6vw,2.6vh) min(2vw,3vh);font-size:clamp(20px,min(2.2vw,4vh),34px);font-weight:700;line-height:1.2}
#tti-packages .tti-alert-head svg{width:clamp(26px,min(2.4vw,4.4vh),40px);height:clamp(26px,min(2.4vw,4.4vh),40px);color:#fff}
#tti-packages .tti-alert-body{padding:min(2vw,3vh);display:flex;flex-direction:column;align-items:flex-start;gap:min(1.2vh,12px);overflow:auto}
#tti-packages .tti-alert-body p{font-size:clamp(15px,min(1.3vw,2.4vh),21px)}
#tti-packages .tti-alert-body .tti-code{display:block;font:clamp(20px,min(2vw,3.6vh),32px) ui-monospace,monospace;overflow-wrap:anywhere}
#tti-packages .tti-alert-close{background:#b3192a;border-color:#b3192a;color:#fff;align-self:flex-end;padding:10px clamp(20px,2.4vw,40px)}
#tti-packages .tti-alert-close:hover{background:#8e1322;border-color:#8e1322}
@media(max-width:600px){
#tti-packages .tti-alert-card{border-radius:0;height:auto;max-height:100%}
#tti-packages .tti-alert-close{align-self:stretch}
}
/* Botao da camera: so em celular e tablet (tela de toque ou estreita). No
computador do balcao o leitor USB ja resolve e o botao so ocuparia lugar. */
#tti-packages .tti-camera-btn{display:none;width:100%;margin-top:12px;background:#eaf0ff;border:1px solid #c4d5ff;color:var(--tti-blue)}
#tti-packages .tti-camera-btn:hover{background:#dbe6ff;border-color:#9fb7f3}
@media (pointer:coarse),(max-width:1000px){#tti-packages .tti-camera-btn{display:flex}}
/* Janela "tem certeza?" (saida com destino) */
#tti-packages .tti-confirm-card{width:min(520px,100%)}
#tti-packages .tti-confirm-card h2{margin-bottom:12px}
#tti-packages .tti-confirm-card .tti-code{display:block;font:clamp(20px,2vw,28px) ui-monospace,monospace;margin:6px 0 10px}
#tti-packages .tti-confirm-card p{font-size:clamp(16px,1.3vw,20px)}
#tti-packages .tti-confirm-botoes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
/* ===== Inicio com 6 opcoes: 3 em cima (entradas), 3 embaixo (saidas e busca) ===== */
#tti-packages .tti-choices .tti-mode:nth-child(n){grid-column:span 2}
@media(max-width:760px){
#tti-packages .tti-choices .tti-mode:nth-child(n){grid-column:auto}
#tti-packages .tti-choices .tti-mode:last-child{grid-column:auto}
}
/* ===== Busca: abas Pacotes / Lotes ===== */
#tti-packages .tti-abas{display:flex;gap:8px;margin:0 0 min(1.4vw,2vh);flex-wrap:wrap}
#tti-packages .tti-abas button{background:#fff;border:1px solid var(--tti-line);color:var(--tti-muted);min-height:clamp(42px,min(3.6vw,6vh),54px)}
#tti-packages .tti-abas button[aria-selected=true]{background:var(--tti-blue);border-color:var(--tti-blue);color:#fff}
#tti-packages .tti-toolbar{grid-template-columns:minmax(240px,1.5fr) repeat(4,minmax(120px,1fr)) auto}
#tti-packages .tti-toolbar-lotes{grid-template-columns:minmax(260px,560px)}
#tti-packages .tti-status.tti-fora{background:#eef1f6;color:#39414f;white-space:normal}
#tti-packages .tti-link{display:inline-flex;min-height:34px!important;padding:4px 10px!important;margin:2px 0 2px 6px;font-size:clamp(12px,1vw,15px)!important;background:#eaf0ff;border:1px solid #c4d5ff;color:var(--tti-blue);border-radius:8px}
#tti-packages .tti-link:hover{background:#dbe6ff}
#tti-packages .tti-link svg{width:16px;height:16px}
#tti-packages .tti-detalhe-status{margin-bottom:18px;line-height:1.8}
/* Historico: anulado riscado, correcao anotada, botao Corrigir */
#tti-packages .tti-timeline li.tti-anulado strong,#tti-packages .tti-timeline li.tti-anulado > span,#tti-packages .tti-timeline li.tti-anulado > small{text-decoration:line-through;color:#8a93a3}
#tti-packages .tti-tag-anulado{display:inline-block;text-decoration:none;background:#fde7ea;color:#8c2030;border-radius:5px;padding:1px 7px;font-size:12px;margin-left:6px}
#tti-packages .tti-correcao{display:flex!important;gap:6px;align-items:flex-start;margin-top:6px!important;padding:6px 8px;border-radius:7px;background:#fff8e1;color:#5c4400!important;text-decoration:none!important}
#tti-packages .tti-correcao svg{width:14px;height:14px;margin-top:3px}
#tti-packages .tti-corrigir{min-height:36px!important;padding:4px 12px!important;margin-top:8px;font-size:13px!important;background:#fff;color:var(--tti-muted)}
/* Formulario de correcao */
#tti-packages .tti-correcao-card{width:min(620px,100%)}
#tti-packages .tti-correcao-card .tti-scrollarea > *+*{margin-top:12px}
#tti-packages .tti-correcao-acao{border:1px solid var(--tti-line);border-radius:10px;padding:10px 14px}
#tti-packages .tti-correcao-acao legend{font-weight:700;padding:0 6px}
#tti-packages .tti-radio{display:flex!important;align-items:center;gap:10px;min-height:44px;font-weight:500!important}
#tti-packages .tti-radio input{width:20px;min-height:20px;height:20px;margin:0}
#tti-packages .tti-correcao-campos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#tti-packages .tti-correcao-campos select,#tti-packages .tti-correcao-linha input{margin-top:6px}
#tti-packages .tti-correcao-erro{background:#fff0f1;border:1px solid #dda2a8;color:#811a25;border-radius:8px;padding:10px 12px;font-weight:600}
#tti-packages .tti-overlay-card > .tti-correcao-erro{flex:0 0 auto;margin-top:12px}
/* Lote: ficha, arquivos, pacotes */
#tti-packages .tti-lote-info{font-size:clamp(15px,1.3vw,19px)}
#tti-packages .tti-subtitulo{font-size:clamp(16px,1.3vw,20px);margin:20px 0 4px}
#tti-packages .tti-anexar{display:inline-flex!important;align-items:center;gap:8px;margin-top:12px}
#tti-packages #tti-lote-upload{margin-top:6px}
#tti-packages .tti-lote-pacotes{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
#tti-packages .tti-lote-pacotes button{min-height:42px;font:15px ui-monospace,monospace;background:#fff}
#tti-packages .tti-lote-pacotes button small{font-family:Inter,Arial,sans-serif;color:var(--tti-muted);margin-left:4px}
#tti-packages .tti-lote-pacotes button.tti-anulado{text-decoration:line-through;opacity:.6}
/* ===== Saida em massa: painel do lote em montagem ===== */
#tti-packages .tti-lote-painel{display:flex;flex-direction:column;min-height:0}
#tti-packages .tti-lote-total{display:flex;align-items:baseline;gap:12px;margin:4px 0 12px}
#tti-packages .tti-lote-total strong{font-size:clamp(40px,min(4vw,7vh),68px);line-height:1;color:var(--tti-blue);font-variant-numeric:tabular-nums}
#tti-packages .tti-lote-total span{color:var(--tti-muted);font-size:clamp(15px,1.2vw,19px)}
#tti-packages .tti-lote-lista{list-style:none;margin:0;padding:0;flex:1;min-height:80px;overflow:auto;border-top:1px solid var(--tti-line)}
#tti-packages .tti-lote-lista li{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid var(--tti-line)}
#tti-packages .tti-lote-lista .tti-code{font:clamp(16px,1.3vw,20px) ui-monospace,monospace}
#tti-packages .tti-lote-lista small{color:var(--tti-muted);flex:1}
#tti-packages .tti-lote-remover{min-height:38px!important;width:38px;padding:0!important;color:#8c2030;border-color:#f3c3c9}
#tti-packages .tti-lote-vazio{flex:1}
#tti-packages .tti-lote-acoes{display:grid;grid-template-columns:1fr 2fr;gap:10px;margin-top:12px}
#tti-packages .tti-lote-fechado{display:flex;flex-direction:column;gap:10px;align-items:stretch}
#tti-packages .tti-lote-fechado > svg{width:52px;height:52px;color:#0f7a43}
#tti-packages .tti-lote-recusados{background:#fff4f5;border:1px solid #f3c3c9;border-radius:10px;padding:10px 12px}
#tti-packages .tti-recusados{margin:6px 0 0;padding-left:18px}
#tti-packages .tti-recusados li{margin:4px 0}
#tti-packages .tti-recusados .tti-code{font:15px ui-monospace,monospace;margin-right:6px}
@media(max-width:1000px){
#tti-packages .tti-toolbar{grid-template-columns:1fr 1fr}
#tti-packages .tti-correcao-campos{grid-template-columns:1fr}
#tti-packages .tti-lote-painel{min-height:320px}
}
/* ===== Inicio com 7 opcoes: 4 entradas em cima, saidas e busca embaixo ===== */
#tti-packages .tti-choices{grid-template-columns:repeat(4,minmax(0,1fr))}
#tti-packages .tti-choices .tti-mode:nth-child(n){grid-column:auto}
#tti-packages .tti-choices .tti-mode:last-child{grid-column:span 2}
@media(max-width:1100px){
#tti-packages .tti-choices{grid-template-columns:repeat(2,minmax(0,1fr))}
#tti-packages .tti-choices .tti-mode:last-child{grid-column:auto}
}
@media(max-width:480px){#tti-packages .tti-choices{grid-template-columns:1fr}}
/* Com a Devolução desligada sobram 6 opções: 3 e 3. */
#tti-packages .tti-choices:has(> :nth-child(6):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
#tti-packages .tti-choices:has(> :nth-child(6):last-child) .tti-mode:last-child{grid-column:auto}
@media(max-width:1100px){#tti-packages .tti-choices:has(> :nth-child(6):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){#tti-packages .tti-choices:has(> :nth-child(6):last-child){grid-template-columns:1fr}}
/* Botao Sair, ao lado do Som */
#tti-packages .tti-sair{display:inline-flex}
#tti-packages .tti-sair button{background:#fff;border:1px solid var(--tti-line);color:var(--tti-muted)}
#tti-packages .tti-sair button:hover{background:#fff0f1;border-color:#dda2a8;color:#811a25}
/* Apagar pacote: acao perigosa, visual de perigo */
#tti-packages .tti-apagar-linha{margin-top:22px;padding-top:16px;border-top:1px solid var(--tti-line);display:flex;justify-content:flex-end}
#tti-packages .tti-apagar{background:#fff;border:1px solid #f3c3c9;color:#8c2030}
#tti-packages .tti-apagar:hover{background:#fff0f1;border-color:#dda2a8}
#tti-packages .tti-apagar-card h2{display:flex;align-items:center;gap:10px;color:#8c2030}
#tti-packages .tti-apagar-card h2 svg{color:#a3182a}
#tti-packages .tti-apagar-aviso{display:flex;gap:10px;align-items:flex-start;background:#fff4f5;border:1px solid #f3c3c9;border-radius:10px;padding:10px 12px;margin-top:10px}
#tti-packages .tti-apagar-aviso svg{flex-shrink:0;color:#a3182a;margin-top:2px}
#tti-packages .tti-perigo{background:#a3182a;border-color:#a3182a;color:#fff}
#tti-packages .tti-perigo:hover{background:#8e1322;border-color:#8e1322}
#tti-packages .tti-apagar-card .tti-scrollarea > *+*{margin-top:10px}
#tti-packages .tti-apagar-card .tti-apagar-aviso{padding:8px 12px}
#tti-packages .tti-apagar-card .tti-correcao-campos{gap:10px}
#tti-packages .tti-apagar-card .tti-confirm-botoes{margin-top:12px}
/* Qual loja esta conectada -- num sistema com varias contas, isso nao pode
ficar escondido: evita bipar a noite inteira no acesso errado. */
#tti-packages .tti-loja{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--tti-line);border-radius:10px;background:#f4f7ff;color:#1c2b4a;font-weight:700;max-width:26ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Tarja de suporte ("entrando como a loja"): flutua no rodape, por cima de
tudo, sem empurrar nada -- a tela do balcao nao rola. */
#djhj{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:60;width:auto;max-width:min(720px,94vw)}
#djhj .djhj-notification{display:flex;align-items:center;gap:14px;background:#7a1020;color:#fff;border-radius:12px;padding:10px 16px;box-shadow:0 10px 30px rgba(9,20,45,.35);margin:0}
#djhj .djhj-message{font-weight:600;font-size:15px}
#djhj .djhj-message em{font-style:normal;text-decoration:underline}
#djhj .djhj-actions{display:flex;gap:8px;margin:0}
#djhj .djhj-button{background:#fff;color:#7a1020;border:0;border-radius:8px;padding:9px 14px;font-weight:700;white-space:nowrap;cursor:pointer}
#djhj .djhj-button:hover{background:#ffe9ec}
/* ===================================================================
Celular: a tela ROLA como qualquer site.
A regra de "sem rolagem" existe para o balcao (monitor/tablet parado
na bancada). No celular ela so atrapalhava: o sistema tentava espremer
as seis opcoes na altura da tela e cortava icone e texto dos cartoes.
=================================================================== */
@media(max-width:700px){
html,body{height:auto;overflow:visible}
#tti-packages{height:auto;min-height:100dvh;font-size:16px}
#tti-packages .tti-main{overflow:visible;min-height:0;padding:14px}
/* Cabecalho em duas linhas: logo em cima, loja e acoes embaixo. */
#tti-packages .tti-top{flex-wrap:wrap;gap:10px;padding:10px 14px}
#tti-packages .tti-brand{flex:0 0 auto}
#tti-packages .tti-logo{width:44px;height:44px}
#tti-packages .tti-top-right{flex:1;min-width:100%;gap:8px}
#tti-packages .tti-loja{flex:1;min-width:0;max-width:none;padding:8px 12px;font-size:14px}
#tti-packages .tti-top-right button{min-height:44px;padding:8px 12px;font-size:14px;white-space:nowrap}
/* O botao do som vira so o icone: o nome da loja e mais importante aqui. */
#tti-packages #tti-sound .tti-rotulo{display:none}
#tti-packages #tti-sound{gap:0;padding:8px 10px}
/* Cartoes do inicio: altura pelo conteudo, nada cortado. */
#tti-packages .tti-choices{display:grid;grid-template-columns:1fr;grid-auto-rows:auto;gap:10px}
#tti-packages .tti-choices .tti-mode{grid-column:auto!important}
#tti-packages .tti-mode{overflow:visible;min-height:0;padding:16px;gap:4px;align-items:flex-start;text-align:left}
#tti-packages .tti-mode strong{font-size:24px;line-height:1.15}
#tti-packages .tti-mode span{font-size:14px;line-height:1.3}
#tti-packages .tti-mode svg{width:26px;height:26px;margin-bottom:4px}
/* Telas de trabalho: uma coluna, cada bloco com a sua altura. */
#tti-packages .tti-work{display:block}
#tti-packages .tti-work > *+*{margin-top:12px}
#tti-packages .tti-work aside{overflow:visible}
#tti-packages .tti-panel{padding:16px;min-height:0}
#tti-packages .tti-result{min-height:0;padding:16px}
#tti-packages .tti-scan{min-height:56px;font-size:20px}
/* Busca: filtros empilhados e lista inteira, sem rolagem dentro de rolagem. */
#tti-packages .tti-board{display:block}
#tti-packages .tti-board > *+*{margin-top:12px}
#tti-packages .tti-toolbar{display:grid;grid-template-columns:1fr;gap:10px}
#tti-packages .tti-results{display:block}
#tti-packages .tti-scrollarea{overflow:visible;max-height:none;flex:none}
#tti-packages h1{font-size:26px}
#tti-packages .tti-heading{margin-bottom:12px}
#tti-packages .tti-chip strong{font-size:26px}
/* As janelas que abrem por cima (historico, correcao, apagar) continuam
ocupando a tela e rolando por dentro -- e o unico lugar onde faz sentido. */
#tti-packages .tti-overlay{position:fixed}
#tti-packages .tti-overlay-card{max-height:100%}
#tti-packages .tti-overlay-card .tti-scrollarea{overflow:auto}
}
/* ===================================================================
Notebook de tela baixa (1366x768 e parecidos): o balcao continua sem
rolagem, mas o enfeite encolhe para a lista de pacotes caber mais.
=================================================================== */
@media(min-width:701px) and (max-height:820px){
#tti-packages .tti-top{padding:6px clamp(16px,2.2vw,40px)}
#tti-packages .tti-logo{width:clamp(38px,6vh,52px);height:clamp(38px,6vh,52px)}
#tti-packages .tti-nav{padding:6px clamp(16px,2.2vw,40px)}
#tti-packages .tti-footer{display:none}
#tti-packages .tti-main{padding:12px clamp(16px,2.2vw,40px)}
#tti-packages h1{font-size:clamp(22px,3.6vh,34px);margin:0 0 2px}
#tti-packages .tti-heading{margin-bottom:10px}
#tti-packages .tti-heading p{display:none}
#tti-packages .tti-search-mode .tti-eyebrow{display:none}
#tti-packages .tti-panel{padding:12px 16px}
#tti-packages .tti-board{gap:10px}
#tti-packages .tti-toolbar{gap:10px}
#tti-packages .tti-chip{padding:6px 14px}
#tti-packages .tti-chip strong{font-size:clamp(22px,3.4vh,30px)}
#tti-packages button,#tti-packages input,#tti-packages select{min-height:clamp(42px,6vh,52px)}
#tti-packages .tti-results td{padding:min(1vh,10px) 8px}
}
/* Com a camera aberta, a pagina por tras nao rola (vale so no celular, onde
a rolagem existe). */
html.tti-camera-aberta,html.tti-camera-aberta body{overflow:hidden}