/* =====================================================================
   BELA FLOR — sistema visual
   Princípios: limpo, legível e óbvio de usar.
   - Uma fonte só na interface (Source Sans 3), tamanhos generosos.
   - Cor só onde informa: situação do pedido, ações e alertas.
   - Sem fundos pretos: superfícies claras; a marca aparece na logo
     (letreiro conhaque) e nas
     peças impressas (cartão), que seguem o manual.
   Troque cores e fontes só aqui no :root.
   ===================================================================== */
:root{
  color-scheme:light;
  --font:'Source Sans 3', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-script:'Pinyon Script', cursive;

  /* paleta do manual */
  --preto:#141112;
  --dourado:#E8B17D;
  --baunilha:#F5DFC0;
  --rosa:#DE818E;
  --conhaque:#75352B;

  /* neutros (levemente quentes) */
  --bg:#F6F5F2;
  --surface:#FFFFFF;
  --surface-2:#FAF9F7;
  --hover:#F1EFEB;
  --line:#E7E3DD;
  --line-strong:#D3CCC2;
  --ink:#1B1718;
  --ink-2:#4A4345;
  --ink-soft:#7A7270;

  /* marca na interface */
  --accent:var(--conhaque);
  --accent-hover:#5E2A22;
  --accent-soft:#F6ECE9;
  --accent-ink:#FFFFFF;

  /* semânticas */
  --ok:#2F6B3A;     --ok-soft:#E6F1E6;
  --warn:#8A5418;   --warn-soft:#FBEEDD;
  --danger:#B42318; --danger-soft:#FCEBE9;

  /* situação dos pedidos */
  --st-novo:#A23B4D;      --st-novo-bg:#FBE8EB;
  --st-producao:#8A5418;  --st-producao-bg:#FBEEDD;
  --st-saiu:#24607A;      --st-saiu-bg:#E3EFF4;
  --st-entregue:#2F6B3A;  --st-entregue-bg:#E6F1E6;
  --st-cancelado:#6F6762; --st-cancelado-bg:#EEEBE7;

  --r-sm:8px; --r:10px; --r-lg:14px;
  --sombra:0 1px 2px rgba(27,23,24,.05);
  --sombra-alta:0 20px 50px -18px rgba(27,23,24,.35);
  --foco:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent);
  --lateral:228px;
  --rail:84px;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--font); font-size:15.5px; line-height:1.45; -webkit-font-smoothing:antialiased;}
h1,h2,h3{font-family:var(--font); margin:0; text-wrap:balance; color:var(--ink); letter-spacing:-.005em;}
p{margin:0;}
button,input,select,textarea{font:inherit; color:inherit;}
[hidden]{display:none !important;}
a{color:var(--accent);}
.muted{color:var(--ink-soft);}
.num{font-variant-numeric:tabular-nums; white-space:nowrap;}
.pre{white-space:pre-wrap;}
.ico{width:18px; height:18px; flex:none;}
:focus-visible{outline:none; box-shadow:var(--foco); border-radius:var(--r-sm);}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

.carregando{min-height:60vh; display:flex; align-items:center; justify-content:center; gap:10px; color:var(--ink-soft);}
.spinner{width:14px; height:14px; border-radius:50%; border:2px solid var(--line); border-top-color:var(--accent); animation:gira .8s linear infinite; display:inline-block; vertical-align:-2px;}
@keyframes gira{to{transform:rotate(360deg);}}

/* ---------------------------------------------------------------- botões */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:0 16px; border-radius:var(--r-sm); border:1px solid transparent; font-weight:600; font-size:15px; cursor:pointer; white-space:nowrap; text-decoration:none; transition:background .12s, border-color .12s, color .12s;}
.btn .ico{width:17px; height:17px;}
.btn:disabled{opacity:.5; cursor:not-allowed;}
.btn-sm{min-height:36px; padding:0 12px; font-size:14px;}
.btn-primary{background:var(--accent); color:var(--accent-ink);}
.btn-primary:not(:disabled):hover{background:var(--accent-hover);}
.btn-ghost{background:var(--surface); border-color:var(--line-strong); color:var(--ink);}
.btn-ghost:not(:disabled):hover{background:var(--hover);}
.btn-texto{background:transparent; color:var(--ink-2); padding:0 10px;}
.btn-texto:not(:disabled):hover{background:var(--hover); color:var(--ink);}
.btn-texto-perigo{background:transparent; color:var(--danger); padding:0 10px;}
.btn-texto-perigo:not(:disabled):hover{background:var(--danger-soft);}
.btn-danger{background:var(--danger); color:#fff;}
.btn-danger:not(:disabled):hover{background:color-mix(in srgb,var(--danger) 85%,#000);}
.btn-bloco{width:100%;}
.link-btn{appearance:none; background:none; border:none; padding:0; color:var(--accent); font-weight:600; font-size:inherit; cursor:pointer;}
.link-btn:hover{text-decoration:underline;}
.icone-btn{display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:var(--r-sm); border:none; background:transparent; color:var(--ink-soft); cursor:pointer; flex:none;}
.icone-btn:hover{background:var(--hover); color:var(--ink);}
.x{appearance:none; display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:var(--r-sm); border:none; background:transparent; color:var(--ink-soft); cursor:pointer; flex:none;}
.x .ico{width:16px; height:16px;}
.x:hover{color:var(--danger); background:var(--danger-soft);}
.x-sm{width:24px; height:24px;}
.x-sm .ico{width:13px; height:13px;}

/* ---------------------------------------------------------------- campos */
.campo{display:flex; flex-direction:column; gap:6px; min-width:0;}
.campo > label,.rotulo{font-size:14px; font-weight:600; color:var(--ink-2);}
.ajuda{font-size:13.5px; color:var(--ink-soft);}
.input,.select,.textarea{width:100%; min-height:44px; background:var(--surface); border:1px solid var(--line-strong); border-radius:var(--r-sm); padding:9px 12px; font-size:15.5px; color:var(--ink); transition:border-color .12s, box-shadow .12s;}
.input::placeholder,.textarea::placeholder{color:#A39B97;}
.input:hover,.select:hover,.textarea:hover{border-color:#BCB3A8;}
.input:focus,.select:focus,.textarea:focus{outline:none; border-color:var(--accent); box-shadow:var(--foco);}
.select{appearance:none; padding-right:34px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A7270' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 10px center; background-size:16px; cursor:pointer;}
.select-sm{min-height:36px; padding-top:5px; padding-bottom:5px; font-size:14.5px; width:auto;}
.textarea{resize:vertical; min-height:100px; line-height:1.5;}
.textarea-sm{min-height:72px;}
.input.invalido,.select.invalido,.textarea.invalido{border-color:var(--danger); box-shadow:0 0 0 3px color-mix(in srgb,var(--danger) 15%,transparent);}
.form-erro{color:var(--danger); font-size:14.5px; font-weight:600;}
.campos{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px;}
.campo-2{grid-column:span 2;}
@media (max-width:560px){.campo-2{grid-column:auto;}}
.input-moeda{position:relative; display:flex; align-items:center;}
.input-moeda > span{position:absolute; left:12px; font-size:14px; color:var(--ink-soft); pointer-events:none;}
.input-moeda .input{padding-left:36px; text-align:right; font-variant-numeric:tabular-nums;}

.switch{display:inline-flex; align-items:center; gap:10px; cursor:pointer; font-size:15px; min-height:44px;}
.switch input{position:absolute; opacity:0; width:1px; height:1px;}
.switch-trilho{width:40px; height:24px; border-radius:99px; background:var(--line-strong); position:relative; flex:none; transition:background .15s;}
.switch-trilho::after{content:""; position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.2); transition:transform .15s;}
.switch input:checked + .switch-trilho{background:var(--accent);}
.switch input:checked + .switch-trilho::after{transform:translateX(16px);}
.switch input:focus-visible + .switch-trilho{box-shadow:var(--foco);}

/* ---------------------------------------------------------------- marcadores */
.avatar{display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-size:12px; font-weight:700; flex:none;}
.avatar-lg{width:36px; height:36px; font-size:13px;}
.badge-n{min-width:22px; height:22px; padding:0 7px; border-radius:99px; background:var(--accent); color:#fff; font-size:12.5px; font-weight:700; display:inline-flex; align-items:center; justify-content:center;}
.st{display:inline-flex; align-items:center; gap:6px; font-size:13.5px; font-weight:600; padding:3px 10px; border-radius:99px; white-space:nowrap;}
.st::before{content:""; width:7px; height:7px; border-radius:50%; background:currentColor;}
.st-novo{background:var(--st-novo-bg); color:var(--st-novo);}
.st-producao{background:var(--st-producao-bg); color:var(--st-producao);}
.st-saiu{background:var(--st-saiu-bg); color:var(--st-saiu);}
.st-entregue{background:var(--st-entregue-bg); color:var(--st-entregue);}
.st-cancelado{background:var(--st-cancelado-bg); color:var(--st-cancelado);}
.marca-info{display:inline-flex; align-items:center; gap:5px; font-size:13.5px; font-weight:600; color:var(--ink-2); white-space:nowrap;}
.marca-info .ico{width:15px; height:15px;}
.mi-cartao{color:#9A3A4C;}
.mi-receber{color:var(--warn);}
.mi-pago{color:var(--ok);}
.mi-atraso{color:var(--danger);}

/* ---------------------------------------------------------------- estrutura */
.app{display:grid; grid-template-columns:var(--lateral) minmax(0,1fr); min-height:100vh;}
.lateral{position:sticky; top:0; height:100vh; display:flex; flex-direction:column; gap:28px; padding:28px 14px 16px; background:var(--surface); border-right:1px solid var(--line); z-index:30;}
.marca{display:flex; align-items:center; justify-content:center; padding:0 6px; min-width:0;}
.marca-img{width:100%; max-width:168px; height:auto; display:block;}
.nav{display:flex; flex-direction:column; gap:4px;}
.nav-item{position:relative; display:flex; align-items:center; gap:12px; width:100%; min-height:46px; padding:0 14px; border:none; border-radius:var(--r-sm); background:transparent; color:var(--ink-2); font-size:16px; font-weight:500; cursor:pointer; text-align:left; white-space:nowrap;}
.nav-item .ico{width:20px; height:20px; color:var(--ink-soft);}
.nav-item:hover{background:var(--hover); color:var(--ink);}
.nav-item[aria-selected="true"]{background:var(--accent-soft); color:var(--accent); font-weight:600;}
.nav-item[aria-selected="true"] .ico{color:var(--accent);}
.nav-item .badge-n{margin-left:auto;}
.lateral-rodape{margin-top:auto; border-top:1px solid var(--line); padding-top:14px;}
.usuario{display:flex; align-items:center; gap:10px; padding:0 0 0 6px; min-width:0;}
.usuario-txt{display:flex; flex-direction:column; min-width:0; flex:1;}
.usuario-txt strong{font-size:15px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.usuario-txt small{font-size:13px; color:var(--ink-soft);}

.area{min-width:0; display:flex; flex-direction:column;}
.topo-celular{display:none;}
.barra-topo{display:flex; align-items:center; justify-content:space-between; gap:12px 20px; flex-wrap:wrap; padding:28px 36px 8px; max-width:1200px; width:100%;}
.titulo-pagina{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;}
.titulo-pagina h1{font-size:28px; font-weight:700;}
.titulo-pagina p{color:var(--ink-soft); font-size:15.5px;}
.titulo-pagina p::first-letter{text-transform:uppercase;}
.acoes-topo{display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.salvo{display:inline-flex; align-items:center; gap:6px; font-size:14px; color:var(--ink-soft);}
.salvo:empty{display:none;}
.salvo.erro{color:var(--danger); font-weight:600;}
.salvo .ico{width:15px; height:15px;}
main.wrap{padding:16px 36px 72px; outline:none; max-width:1200px; width:100%;}

.secao{margin-bottom:32px;}
.secao-head{display:flex; flex-direction:column; gap:2px; margin:0 0 14px;}
.secao-head h2{font-size:20px; font-weight:700;}
.secao-head p{color:var(--ink-soft); font-size:14.5px;}
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:20px;}
.vazio{color:var(--ink-soft); font-size:15px;}
.vazio-grande{display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; padding:56px 20px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); color:var(--ink-soft);}
.vazio-grande h3{font-size:18px; font-weight:600; color:var(--ink-2);}
.ico-vazio{width:36px; height:36px; color:var(--line-strong);}

.alerta-linha{display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:12px 16px; border-radius:var(--r); background:var(--danger-soft); color:var(--danger); font-weight:600; margin-bottom:16px;}
.alerta-linha .ico{width:18px; height:18px;}
.alerta-linha span{flex:1 1 200px;}
.alerta-linha .link-btn{color:var(--danger); text-decoration:underline; margin-left:auto;}

/* ---------------------------------------------------------------- pedidos: filtros */
.abas-dia{display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:16px; overflow-x:auto; scrollbar-width:none;}
.abas-dia::-webkit-scrollbar{display:none;}
.aba-dia{position:relative; display:inline-flex; align-items:center; gap:7px; min-height:46px; padding:0 14px; border:none; background:transparent; color:var(--ink-soft); font-size:16px; font-weight:600; cursor:pointer; white-space:nowrap;}
.aba-dia:hover{color:var(--ink);}
.aba-dia[aria-pressed="true"]{color:var(--ink);}
.aba-dia[aria-pressed="true"]::after{content:""; position:absolute; left:10px; right:10px; bottom:-1px; height:3px; border-radius:3px 3px 0 0; background:var(--accent);}
.aba-dia .n{font-size:13px; font-weight:600; color:var(--ink-soft); background:var(--hover); border-radius:99px; padding:1px 8px;}
.aba-dia[aria-pressed="true"] .n{background:var(--accent-soft); color:var(--accent);}
.aba-data{position:relative; display:inline-flex;}
.aba-data .ico{width:17px; height:17px;}
.aba-data input{position:absolute; left:0; bottom:0; width:100%; height:1px; opacity:0; pointer-events:none; border:0; padding:0;}
.filtros{display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:0 0 16px;}
.chips{display:flex; flex-wrap:wrap; gap:8px; flex:1 1 auto;}
.chip-filtro{display:inline-flex; align-items:center; gap:7px; min-height:38px; padding:0 14px; border:1px solid var(--line-strong); border-radius:99px; background:var(--surface); color:var(--ink-2); font-size:14.5px; font-weight:600; cursor:pointer; white-space:nowrap;}
.chip-filtro:hover{border-color:var(--ink-soft); color:var(--ink);}
.chip-filtro .n{color:var(--ink-soft); font-weight:600;}
.chip-filtro .dot{width:8px; height:8px; border-radius:50%; background:var(--c);}
.chip-filtro[aria-pressed="true"]{background:var(--accent-soft); border-color:var(--accent); color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent);}
.chip-filtro[aria-pressed="true"] .n{color:var(--accent);}
.busca{position:relative; flex:0 1 300px; display:flex; align-items:center; min-width:200px;}
.busca .ico{position:absolute; left:12px; width:17px; height:17px; color:var(--ink-soft); pointer-events:none;}
.busca input{width:100%; min-height:42px; padding:8px 12px 8px 38px; border:1px solid var(--line-strong); border-radius:var(--r-sm); background:var(--surface); font-size:15px;}
.busca input:focus{outline:none; border-color:var(--accent); box-shadow:var(--foco);}
.lista-titulo{font-size:15px; color:var(--ink-soft); margin:0 0 10px;}
.lista-titulo b{color:var(--ink);}

/* ---------------------------------------------------------------- pedidos: lista */
.grupo-dia{margin-bottom:24px;}
.dia-titulo{font-size:16px; font-weight:700; margin:0 0 8px; display:flex; gap:8px; align-items:baseline;}
.dia-titulo small{font-size:14px; font-weight:400; color:var(--ink-soft);}
.lista-pedidos{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden;}
.ped{display:grid; grid-template-columns:100px minmax(0,1fr) 150px 150px 92px 190px; gap:16px; align-items:center; padding:14px 18px; border-top:1px solid var(--line); cursor:pointer; transition:background .1s;}
.ped:first-child{border-top:none;}
.ped:hover{background:var(--surface-2);}
.ped-cancelado{opacity:.6;}
.ped-hora{font-size:15.5px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap;}
.ped-hora small{display:block; font-size:13px; font-weight:400; color:var(--ink-soft);}
.ped-info{display:flex; flex-direction:column; gap:3px; min-width:0;}
.ped-nome{font-size:16px; font-weight:700; overflow-wrap:anywhere;}
.ped-itens{font-size:14.5px; color:var(--ink-2); overflow-wrap:anywhere;}
.ped-marcas{display:flex; gap:12px; flex-wrap:wrap; margin-top:2px;}
.ped-marcas:empty{display:none;}
.ped-onde{display:flex; align-items:center; gap:6px; font-size:14.5px; color:var(--ink-2); min-width:0;}
.ped-onde .ico{width:16px; height:16px; color:var(--ink-soft);}
.ped-onde span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.ped-valor{font-size:15.5px; font-weight:600; text-align:right; font-variant-numeric:tabular-nums;}
.ped-acao{display:flex; justify-content:flex-end;}
.btn-avancar{min-height:34px; padding:0 12px; font-size:14px; background:var(--surface); border:1px solid var(--line-strong); color:var(--ink);}
.btn-avancar:hover{border-color:var(--accent); color:var(--accent); background:var(--accent-soft);}
.btn-avancar .ico{width:15px; height:15px;}
.lista-rodape{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:4px; font-size:15px;}

/* ---------------------------------------------------------------- pedidos: quadro (kanban) */
.visao{display:inline-flex; padding:3px; background:var(--hover); border-radius:var(--r-sm); gap:2px;}
.visao-btn{display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:0 12px; border:none; border-radius:6px; background:transparent; color:var(--ink-2); font-size:14.5px; font-weight:600; cursor:pointer;}
.visao-btn .ico{width:16px; height:16px;}
.visao-btn:hover{color:var(--ink);}
.visao-btn[aria-pressed="true"]{background:var(--surface); color:var(--accent); box-shadow:var(--sombra);}
.chips.ajuda{align-self:center; font-size:14px;}
.quadro{display:grid; grid-template-columns:repeat(4,minmax(250px,1fr)); gap:14px; align-items:start; overflow-x:auto; padding-bottom:8px; margin-bottom:20px;}
.kcol{background:var(--hover); border-radius:var(--r-lg); padding:6px; display:flex; flex-direction:column; min-width:0;}
.kcol-topo{display:flex; align-items:center; gap:8px; padding:8px 8px 10px;}
.kcol-topo .dot{width:9px; height:9px; border-radius:50%; background:var(--c);}
.kcol-topo h2{font-size:15px; font-weight:700;}
.kcol-topo .n{margin-left:auto; font-size:13px; font-weight:600; color:var(--ink-soft); background:var(--surface); border-radius:99px; padding:1px 9px;}
.kcol-lista{display:flex; flex-direction:column; gap:8px; min-height:90px; padding:2px; border-radius:var(--r); transition:background .12s;}
.kcol-lista.sobre{background:color-mix(in srgb,var(--c) 12%,transparent); outline:2px dashed var(--c); outline-offset:-2px;}
.kcol-vazia{text-align:center; font-size:14px; color:var(--ink-soft); padding:20px 8px; border:1px dashed var(--line-strong); border-radius:var(--r);}
.kcard{display:flex; flex-direction:column; gap:4px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:12px; cursor:grab; box-shadow:var(--sombra); transition:border-color .12s, box-shadow .12s;}
.kcard:hover{border-color:var(--line-strong); box-shadow:0 4px 14px -8px rgba(27,23,24,.25);}
.kcard.arrastando{opacity:.4;}
.kcard-topo{display:flex; justify-content:space-between; gap:8px; font-size:14px; font-variant-numeric:tabular-nums;}
.kcard .ped-nome{font-size:15.5px;}
.kcard .ped-itens{font-size:14px;}
.kcard-linha{display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:4px;}
.kcard .ped-onde{font-size:14px;}
.kcard .ped-valor{font-size:15px;}
.kcard .ped-marcas{gap:10px;}
.kcard .btn-avancar{margin-top:6px;}

/* ---------------------------------------------------------------- pedido aberto */
.etapas{display:grid; grid-template-columns:repeat(4,1fr); gap:6px;}
.etapa{display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:0; border:none; background:transparent; cursor:pointer; text-align:left; color:var(--ink-soft); font-size:13.5px; font-weight:600;}
.etapa i{display:block; width:100%; height:6px; border-radius:99px; background:var(--line);}
.etapa.feita i{background:var(--c,var(--accent));}
.etapa.atual{color:var(--ink);}
.etapa:hover{color:var(--ink);}
.etapa:disabled{cursor:default;}
.etapas-wrap{display:flex; flex-direction:column; gap:14px;}
.btn-proximo{min-height:50px; font-size:16px; width:100%;}
.aviso-cancelado{display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:12px 16px; border-radius:var(--r); background:var(--st-cancelado-bg); color:var(--st-cancelado); font-weight:600;}
.dados{display:flex; flex-direction:column;}
.dado{display:grid; grid-template-columns:130px minmax(0,1fr); gap:12px; padding:12px 0; border-top:1px solid var(--line);}
.dado:first-child{border-top:none;}
.dado dt{font-size:14px; color:var(--ink-soft); font-weight:600; padding-top:1px;}
.dado dd{margin:0; min-width:0; display:flex; flex-direction:column; gap:2px; overflow-wrap:anywhere;}
.dado dd b{font-weight:600;}
.tabela-itens{width:100%; border-collapse:collapse; font-size:15px;}
.tabela-itens td{padding:3px 0; vertical-align:top;}
.tabela-itens td:first-child{width:36px; color:var(--ink-soft);}
.tabela-itens .num{text-align:right; padding-left:12px;}
.tabela-itens tfoot td{color:var(--ink-soft);}
.tabela-itens tfoot tr:first-child td{border-top:1px solid var(--line); padding-top:6px;}
.tabela-itens tr.total td{color:var(--ink); font-weight:700; font-size:16px;}
.pagto{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:6px;}
.cartao-msg{margin:0; padding:12px 14px; border-radius:var(--r-sm); background:#FCF2F3; white-space:pre-wrap; line-height:1.5;}
.cartao-msg cite{display:block; margin-top:6px; font-style:normal; font-weight:600; color:var(--ink-2);}
.cartao-msg cite::before{content:"— ";}

/* ---------------------------------------------------------------- formulário do pedido */
.form-pedido{gap:28px;}
.secao-form{border:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; min-width:0;}
.secao-form legend{font-size:17px; font-weight:700; padding:0; margin-bottom:12px; color:var(--ink);}
.itens-cab,.item-linha{display:grid; grid-template-columns:minmax(0,1fr) 76px 124px 100px 32px; gap:8px; align-items:center;}
.itens-cab{font-size:13.5px; font-weight:600; color:var(--ink-soft);}
.itens-cab span:nth-child(4){text-align:right;}
#f-itens{display:flex; flex-direction:column; gap:8px;}
.item-prod{display:flex; flex-direction:column; gap:6px; min-width:0;}
.item-qtd{text-align:center;}
.item-sub{text-align:right; font-weight:600;}
.secao-form > .btn{align-self:flex-start;}
.escolha-tipo{display:grid; grid-template-columns:1fr 1fr; gap:8px; max-width:440px;}
.opcao{position:relative; cursor:pointer;}
.opcao input{position:absolute; opacity:0;}
.opcao span{display:flex; align-items:center; justify-content:center; gap:8px; min-height:46px; border:1px solid var(--line-strong); border-radius:var(--r-sm); background:var(--surface); font-weight:600; color:var(--ink-2);}
.opcao input:checked + span{border-color:var(--accent); background:var(--accent-soft); color:var(--accent); box-shadow:inset 0 0 0 1px var(--accent);}
.opcao input:focus-visible + span{box-shadow:var(--foco);}
.rodape-total{display:flex; flex-direction:column; line-height:1.15;}
.rodape-total small{font-size:13px; color:var(--ink-soft);}
.rodape-total strong{font-size:22px; font-weight:700; font-variant-numeric:tabular-nums;}
@media (max-width:620px){
  .itens-cab{display:none;}
  .item-linha{grid-template-columns:72px minmax(0,1fr) 32px; grid-template-areas:"prod prod x" "qtd preco preco" "sub sub sub"; padding:10px; border:1px solid var(--line); border-radius:var(--r); background:var(--surface-2);}
  .item-prod{grid-area:prod;} .item-qtd{grid-area:qtd;} .item-linha .input-moeda{grid-area:preco;} .item-sub{grid-area:sub;} .item-linha .x{grid-area:x;}
}

/* ---------------------------------------------------------------- cadastros e usuários */
.sub-abas{display:flex; gap:4px; padding:4px; background:var(--hover); border-radius:var(--r); width:fit-content; max-width:100%; overflow-x:auto; margin-bottom:22px;}
.sub-aba{min-height:38px; padding:0 16px; border:none; border-radius:var(--r-sm); background:transparent; color:var(--ink-2); font-size:15px; font-weight:600; cursor:pointer; white-space:nowrap;}
.sub-aba:hover{color:var(--ink);}
.sub-aba[aria-selected="true"]{background:var(--surface); color:var(--ink); box-shadow:var(--sombra);}
.add-form{display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end;}
.card .add-form{padding-top:18px; margin-top:18px; border-top:1px solid var(--line);}
.add-form .campo{flex:0 1 auto;}
.add-form .campo-grande{flex:1 1 260px;}
.add-inline{display:flex; gap:8px; flex-wrap:wrap; align-items:center;}
.add-inline .input{flex:1 1 180px; width:auto; max-width:300px;}
.tabela{width:100%; border-collapse:collapse; font-size:15px;}
.tabela th{text-align:left; font-size:13.5px; color:var(--ink-soft); font-weight:600; padding:8px 10px; border-bottom:1px solid var(--line);}
.tabela td{padding:10px; border-bottom:1px solid var(--line); vertical-align:middle;}
.tabela tr:last-child td{border-bottom:none;}
.tabela tr.inativo td:first-child .input{color:var(--ink-soft);}
.tabela-produtos .input{max-width:360px;}
.tabela-produtos .input-moeda{max-width:150px;}
.acoes-cel{text-align:right;}
.tabela-wrap{overflow-x:auto;}
.lista-blocos{display:flex; flex-direction:column; gap:26px;}
.bloco{display:flex; flex-direction:column; gap:10px;}
.tags-lista{display:flex; flex-wrap:wrap; gap:8px;}
.tag-lista{display:inline-flex; align-items:center; gap:2px; padding:4px 4px 4px 12px; border-radius:99px; background:var(--surface-2); border:1px solid var(--line); font-size:15px;}
.passos{margin:16px 0 0; padding-left:20px; color:var(--ink-2); font-size:15px; line-height:1.8;}
.papeis{display:grid; gap:12px; margin:0;}
.papeis > div{display:grid; grid-template-columns:150px 1fr; gap:12px;}
.papeis dt{font-weight:700;}
.papeis dd{margin:0; color:var(--ink-2);}
@media (max-width:620px){.papeis > div{grid-template-columns:1fr; gap:2px;}}

/* ---------------------------------------------------------------- janelas e gaveta */
.fundo{position:fixed; inset:0; z-index:100; background:rgba(27,23,24,.4); display:flex; align-items:flex-start; justify-content:center; padding:40px 16px; overflow-y:auto; animation:aparece .15s ease;}
@keyframes aparece{from{opacity:0;}}
.modal{width:100%; max-width:560px; background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--sombra-alta); display:flex; flex-direction:column; margin:auto 0;}
.modal-largo{max-width:780px;}
.fundo-gaveta{padding:0; justify-content:flex-end; align-items:stretch; overflow:hidden;}
.gaveta{max-width:560px; height:100%; margin:0; border-radius:0; animation:entra .2s ease;}
@keyframes entra{from{transform:translateX(24px); opacity:.6;}}
.gaveta .modal-corpo{flex:1; overflow-y:auto;}
.modal-topo{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:16px 20px; border-bottom:1px solid var(--line);}
.modal-topo .esq{display:flex; align-items:center; gap:12px; flex-wrap:wrap; min-width:0;}
.modal-h{font-size:20px; font-weight:700;}
.fechar{display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:var(--r-sm); border:none; background:transparent; color:var(--ink-soft); cursor:pointer; flex:none;}
.fechar:hover{background:var(--hover); color:var(--ink);}
.modal-corpo{padding:20px; display:flex; flex-direction:column; gap:22px;}
.modal-rodape{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:14px 20px; border-top:1px solid var(--line); background:var(--surface); flex-wrap:wrap; border-radius:0 0 var(--r-lg) var(--r-lg);}
.gaveta .modal-rodape{border-radius:0;}
.modal-rodape .grupo{display:flex; gap:8px; flex-wrap:wrap; align-items:center;}
form .modal-rodape{position:sticky; bottom:0; box-shadow:0 -6px 16px -12px rgba(27,23,24,.25);}
.confirmar{max-width:420px; padding:22px;}
.confirmar p{margin:0 0 18px; font-size:16px; line-height:1.5;}
.confirmar .acoes{display:flex; justify-content:flex-end; gap:8px;}

/* histórico */
.bloco-titulo{font-size:16px; font-weight:700;}
.historico{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px;}
.hist{display:flex; gap:10px; font-size:14.5px; align-items:flex-start;}
.hist-corpo{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; padding:8px 12px; border-radius:var(--r-sm); background:var(--warn-soft);}
.hist-meta{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:baseline; flex:1;}
.hist-meta time{font-size:13px; color:var(--ink-soft); white-space:nowrap;}
.hist p{overflow-wrap:anywhere; white-space:pre-wrap; line-height:1.5; color:var(--ink-2);}
.hist-auto{color:var(--ink-2);}
.hist-auto b{font-weight:600;}
.hist-ponto{width:28px; display:flex; justify-content:center; flex:none; padding-top:7px;}
.hist-ponto::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--line-strong);}
.hist-status .hist-ponto::before{background:var(--accent);}
.hist-acao .hist-ponto::before{background:var(--dourado);}
.coment-form{display:flex; gap:8px; align-items:flex-start;}
.coment-form .textarea{min-height:44px; height:44px; flex:1;}
.coment-form .linha{display:flex;}

/* ---------------------------------------------------------------- login */
.login{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px 16px;}
.login-card{width:100%; max-width:400px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:32px 28px;}
.login-card h1{font-size:28px; font-weight:700; margin:0 0 6px;}
.login-card .sub{color:var(--ink-soft); margin:0 0 24px;}
.login-form{display:flex; flex-direction:column; gap:16px;}
.login-form .btn{min-height:48px; margin-top:4px;}
.login-links{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-top:20px;}
.login-dividido{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); padding:0; align-items:stretch;}
.login-dividido .login-card{align-self:center; justify-self:center; border:none; background:transparent; margin:24px 16px;}
.login-marca{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:22px; padding:48px; background:#FBF4EA; border-right:1px solid var(--line); text-align:center;}
.login-logo{width:min(300px,70%); height:auto; display:block;}
.login-frase{font-size:17px; color:var(--ink-2);}
.login-logo-mobile{display:none; width:190px; height:auto; margin:0 0 24px;}
.senha-wrap{position:relative; display:flex;}
.senha-wrap .input{padding-right:88px;}
.senha-ver{position:absolute; right:6px; top:50%; transform:translateY(-50%); border:none; background:transparent; color:var(--accent); font-weight:600; font-size:14px; cursor:pointer; padding:6px 10px; border-radius:6px;}
.senha-ver:hover{background:var(--accent-soft);}
.msg-erro{background:var(--danger-soft); color:var(--danger); border-radius:var(--r-sm); padding:12px 14px; font-size:15px; font-weight:600;}
.msg-ok{background:var(--ok-soft); color:var(--ok); border-radius:var(--r-sm); padding:12px 14px; font-size:15px; font-weight:600;}
.msg-aviso{display:flex; gap:12px; align-items:flex-start; background:var(--warn-soft); border-radius:var(--r-sm); padding:14px 16px; color:var(--ink);}
.msg-aviso strong{display:block; font-size:15.5px; margin-bottom:3px;}
.msg-aviso p{font-size:14.5px; color:var(--ink-2); line-height:1.5;}
.msg-ico{width:24px; height:24px; border-radius:50%; background:var(--warn); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; flex:none;}

/* ---------------------------------------------------------------- aviso flutuante */
.aviso{position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:200; max-width:min(440px,calc(100% - 32px)); background:var(--accent); color:#fff; padding:12px 18px; border-radius:var(--r); font-weight:600; font-size:15px; box-shadow:var(--sombra-alta); animation:sobe .2s ease;}
.aviso.erro{background:var(--danger);}
@keyframes sobe{from{transform:translate(-50%,8px); opacity:0;}}

/* ---------------------------------------------------------------- lista de pedidos em telas menores */
@media (max-width:1279px){
  .ped{grid-template-columns:96px minmax(0,1fr) 120px; grid-template-areas:"hora info status" "hora onde valor" ". acao acao"; row-gap:6px;}
  .ped-hora{grid-area:hora; align-self:start;}
  .ped-info{grid-area:info;}
  .ped-onde{grid-area:onde;}
  .ped-st{grid-area:status; justify-self:end;}
  .ped-valor{grid-area:valor;}
  .ped-acao{grid-area:acao; margin-top:0;}
}

/* ---------------------------------------------------------------- telas médias: menu lateral estreito */
@media (max-width:1023px){
  .app{grid-template-columns:var(--rail) minmax(0,1fr);}
  .lateral{padding:18px 8px 12px; gap:22px; align-items:stretch;}
  .marca{display:none;}
  .nav-item{flex-direction:column; justify-content:center; gap:4px; min-height:62px; padding:8px 4px; font-size:12.5px; text-align:center;}
  .nav-item .badge-n{position:absolute; top:4px; right:8px; min-width:19px; height:19px; font-size:11px; padding:0 5px;}
  .usuario{flex-direction:column; padding:0; gap:6px;}
  .usuario-txt{display:none;}
  .barra-topo{padding:22px 24px 8px;}
  main.wrap{padding:12px 24px 64px;}
  .gaveta{max-width:100%;}
}

/* ---------------------------------------------------------------- celular: barra de menu embaixo */
@media (max-width:599px){
  body{font-size:16px;}
  .app{grid-template-columns:minmax(0,1fr); padding-bottom:calc(68px + env(safe-area-inset-bottom,0px));}
  .lateral{position:fixed; top:auto; bottom:0; left:0; right:0; height:auto; flex-direction:row; padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px)); gap:0; border-right:none; border-top:1px solid var(--line); box-shadow:0 -4px 14px -10px rgba(27,23,24,.25);}
  .marca,.lateral-rodape{display:none;}
  .nav{flex-direction:row; width:100%; gap:4px;}
  .nav-item{flex:1; min-height:54px;}
  .topo-celular{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 16px; background:var(--surface); border-bottom:1px solid var(--line);}
  .topo-celular img{height:30px; width:auto;}
  .barra-topo{padding:18px 16px 4px;}
  .titulo-pagina h1{font-size:24px;}
  .acoes-topo{width:100%;}
  #acao-principal{flex:1;}
  #acao-principal .btn{width:100%;}
  .alerta-linha{flex-wrap:nowrap; align-items:flex-start;}
  main.wrap{padding:10px 16px 40px;}
  .modal-corpo{padding:16px;}
  .modal-topo,.modal-rodape{padding:12px 16px;}
  .fundo{padding:0;}
  .fundo:not(.fundo-gaveta) .modal{border-radius:0; min-height:100%;}
  .busca{flex:1 1 100%;}
  .chips{flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; margin:0 -16px; padding:0 16px;}
  .chips::-webkit-scrollbar{display:none;}
  .visao-btn span{display:none;}
  .quadro{grid-template-columns:repeat(4,86%); scroll-snap-type:x mandatory; margin:0 -16px 20px; padding:0 16px 8px; scroll-padding:16px;}
  .kcol{scroll-snap-align:start;}
  .ped{grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"hora status" "info info" "onde valor" "acao acao"; gap:6px 12px; padding:14px 16px;}
  .ped-hora small{display:inline; margin-left:6px;}
  .ped-acao .btn{width:100%;}
  .dado{grid-template-columns:1fr; gap:4px;}
  .login-dividido{grid-template-columns:1fr;}
  .login-marca{display:none;}
  .login-logo-mobile{display:block;}
  .aviso{bottom:calc(80px + env(safe-area-inset-bottom,0px));}
}
@media (max-width:760px) and (min-width:600px){
  .login-dividido{grid-template-columns:1fr;}
  .login-marca{display:none;}
  .login-logo-mobile{display:block;}
}
/* ---------------------------------------------------------------- ações do pedido (imprimir e WhatsApp) */
.acoes-pedido{display:grid; grid-template-columns:repeat(3,1fr); gap:8px;}
.acoes-pedido .btn{min-height:46px;}
.btn-whats .ico{color:#1F8A4C;}
.btn-whats-cheio{background:#1F8A4C; color:#fff;}
.btn-whats-cheio:not(:disabled):hover{background:#18703D;}

/* escolhas em cartão (radio grande) */
.escolhas{display:flex; flex-direction:column; gap:8px;}
.escolhas-grade{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr));}
.escolha{position:relative; cursor:pointer; display:block;}
.escolha input{position:absolute; opacity:0;}
.escolha > span{display:flex; flex-direction:column; gap:2px; padding:11px 14px; border:1px solid var(--line-strong); border-radius:var(--r-sm); background:var(--surface);}
.escolha b{font-weight:600;}
.escolha small{font-size:13.5px; color:var(--ink-soft);}
.escolha:hover > span{border-color:var(--ink-soft);}
.escolha input:checked + span{border-color:var(--accent); background:var(--accent-soft); box-shadow:inset 0 0 0 1px var(--accent);}
.escolha input:checked + span b{color:var(--accent);}
.escolha input:focus-visible + span{box-shadow:var(--foco);}
.sugerida{font-style:normal; font-size:12.5px; font-weight:600; color:#1F8A4C; background:#E5F4EA; border-radius:99px; padding:1px 8px; margin-left:6px;}
.nota-simulador{display:flex; gap:8px; align-items:flex-start; padding:10px 14px; border-radius:var(--r-sm); background:var(--warn-soft); color:var(--warn); font-weight:600; font-size:14.5px;}
.nota-simulador .ico{margin-top:2px;}

/* segmentado (opções lado a lado) */
.segmento{display:inline-flex; flex-wrap:wrap; padding:3px; gap:2px; background:var(--hover); border-radius:var(--r-sm); width:fit-content; max-width:100%;}
.segmento label{position:relative; cursor:pointer;}
.segmento input{position:absolute; opacity:0;}
.segmento span{display:inline-flex; align-items:center; min-height:36px; padding:0 14px; border-radius:6px; font-weight:600; color:var(--ink-2); font-size:14.5px;}
.segmento input:checked + span{background:var(--surface); color:var(--accent); box-shadow:var(--sombra);}
.segmento input:focus-visible + span{box-shadow:var(--foco);}
.range{width:100%; accent-color:var(--accent); min-height:30px;}

/* prévia da impressão */
.previa-caixa{background:var(--hover); border-radius:var(--r); padding:16px; display:flex; justify-content:center; overflow:hidden; min-height:120px;}
.previa-papel{background:#fff; box-shadow:0 1px 3px rgba(27,23,24,.2), 0 8px 24px -12px rgba(27,23,24,.3); overflow:hidden; flex:none;}
.previa-papel iframe{border:0; display:block; background:#fff; pointer-events:none;}
.previa-mini{min-height:0; padding:12px;}

/* aba Impressão */
.barra-salvar{display:flex; align-items:center; justify-content:space-between; gap:10px 16px; flex-wrap:wrap; padding:10px 12px 10px 16px; border-radius:var(--r); background:var(--surface); border:1px solid var(--line); margin-bottom:16px; font-size:14.5px; color:var(--ink-soft); position:sticky; top:8px; z-index:5;}
.barra-salvar > span{display:flex; align-items:center; gap:8px;}
.barra-salvar > span .ico{color:var(--ok);}
.barra-salvar.alterada{background:var(--warn-soft); border-color:#F0D3AE; color:var(--warn); font-weight:600;}
.barra-salvar.alterada > span .ico{color:var(--warn);}
.barra-salvar .grupo{display:flex; gap:8px;}
.imp-grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,440px); gap:20px; align-items:start;}
.imp-form{display:flex; flex-direction:column; gap:28px;}
.imp-previa{position:sticky; top:76px; display:flex; flex-direction:column; gap:12px;}
.imp-previa-topo{display:flex; align-items:center; justify-content:space-between; gap:8px;}
.modelos{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:16px;}
.modelo{display:flex; flex-direction:column; gap:14px;}
.cores{display:flex; gap:10px; flex-wrap:wrap;}
.cor{display:flex; flex-direction:column; align-items:center; gap:4px; cursor:pointer; position:relative;}
.cor input{position:absolute; opacity:0;}
.cor span{width:38px; height:38px; border-radius:50%; background:var(--cor); border:1px solid var(--line-strong);}
.cor input:checked + span{box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--accent);}
.cor input:focus-visible + span{box-shadow:var(--foco);}
.cor small{font-size:12.5px; color:var(--ink-soft);}
.form-acoes{display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; padding-top:12px; border-top:1px solid var(--line);}

/* aba WhatsApp */
.msg-grid{display:grid; grid-template-columns:280px minmax(0,1fr); gap:20px; align-items:start;}
.msg-lista{display:flex; flex-direction:column; gap:6px;}
.msg-item{display:flex; flex-direction:column; gap:2px; text-align:left; padding:12px 14px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); cursor:pointer;}
.msg-item b{font-weight:600;}
.msg-item small{font-size:13.5px; color:var(--ink-soft);}
.msg-item:hover{border-color:var(--line-strong);}
.msg-item.sel{border-color:var(--accent); background:var(--accent-soft); box-shadow:inset 0 0 0 1px var(--accent);}
.msg-item.sel b{color:var(--accent);}
.msg-item.inativa b{color:var(--ink-soft);}
.msg-editor{display:flex; flex-direction:column; gap:18px;}
.campos-msg{display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:6px;}
.chip-campo{min-height:32px; padding:0 10px; border:1px dashed var(--line-strong); border-radius:99px; background:var(--surface-2); color:var(--ink-2); font-size:13.5px; font-weight:600; cursor:pointer;}
.chip-campo:hover{border-color:var(--accent); color:var(--accent); border-style:solid;}
.msg-previa{white-space:pre-wrap; padding:12px 14px; border-radius:10px 10px 10px 2px; background:#E5F4EA; color:#183A24; max-width:520px; line-height:1.5; font-size:15px;}

@media (max-width:1023px){
  .imp-grid{grid-template-columns:1fr;}
  .imp-previa{position:static; order:-1;}
  .msg-grid{grid-template-columns:1fr;}
  .msg-lista{flex-direction:row; flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px;}
  .msg-lista > *{flex:none; min-width:180px;}
  .msg-lista .btn{min-width:auto;}
}
@media (max-width:599px){
  .acoes-pedido .btn{flex-direction:column; gap:4px; min-height:58px; font-size:13.5px; padding:6px;}
  .barra-salvar{top:4px;}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important; animation:none !important;}}

/* ---------------------------------------------------------------- tela do entregador */
.ent{min-height:100vh; display:flex; flex-direction:column;}
.ent-topo{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 16px; background:var(--surface); border-bottom:1px solid var(--line); position:sticky; top:env(safe-area-inset-top,0px); z-index:10;}
.ent-topo img{height:32px; width:auto;}
.ent-usuario{display:flex; align-items:center; gap:6px;}
.ent-corpo{width:100%; max-width:640px; margin:0 auto; padding:18px 16px 48px;}
.ent-corpo .titulo-pagina{margin-bottom:12px;}
.ent-grupo{margin-bottom:24px;}
.ent-grupo-titulo{font-size:17px; font-weight:700; margin:0 0 10px; display:flex; align-items:center; gap:8px;}
.ent-grupo-titulo .n{font-size:13px; font-weight:600; color:var(--ink-soft); background:var(--hover); border-radius:99px; padding:1px 9px;}
.ent-card{display:flex; flex-direction:column; gap:10px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:16px; margin-bottom:12px;}
.ent-card .btn-sm{align-self:flex-start;}
.ent-saiu{border-color:var(--st-saiu); box-shadow:inset 0 0 0 1px var(--st-saiu);}
.ent-entregue{opacity:.7;}
.ent-card-topo{display:flex; justify-content:space-between; align-items:baseline; gap:8px;}
.ent-hora{font-size:20px; font-weight:700; font-variant-numeric:tabular-nums;}
.ent-end{display:flex; flex-direction:column; gap:2px; font-size:16px;}
.ent-end b{font-size:17px;}
.ent-linha{display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:15px; padding-top:10px; border-top:1px solid var(--line);}
.ent-linha > span:first-child{display:flex; align-items:center; gap:8px; min-width:0; overflow-wrap:anywhere;}
.ent-linha .ico{color:var(--ink-soft); flex:none;}
.ent-contato{display:flex; gap:4px;}
.ent-contato .icone-btn{border:1px solid var(--line-strong); width:44px; height:44px;}
.ent-whats .ico{color:#1F8A4C;}
.ent-receber,.ent-obs{display:flex; gap:8px; align-items:flex-start; padding:10px 12px; border-radius:var(--r-sm); font-size:15px;}
.ent-receber{background:var(--warn-soft); color:var(--warn);}
.ent-obs{background:var(--surface-2); color:var(--ink-2);}
.ent-receber .ico,.ent-obs .ico{margin-top:2px;}

/* =====================================================================
   VERSÃO FINAL: Início, Conversas, Clientes, Ajustes, tour
   ===================================================================== */
.badge-alerta{background:var(--danger); color:#fff;}
.badge-leve{background:var(--hover); color:var(--ink-2);}
.nav-item[aria-selected="true"] .badge-leve{background:#fff;}
.nav-tour{min-height:40px; font-size:15px; margin-bottom:8px;}
.secao-head-linha{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px;}
.btn.desativado{opacity:.5; pointer-events:none;}
.switch-sm{min-height:36px; font-size:14px;}
.switch-sm .switch-trilho{width:34px; height:20px;}
.switch-sm .switch-trilho::after{width:14px; height:14px;}
.switch-sm input:checked + .switch-trilho::after{transform:translateX(14px);}
.aviso-acao{display:flex; align-items:center; gap:12px; padding:8px 8px 8px 18px;}
.aviso-acao .btn{background:#fff; color:var(--accent); min-height:34px;}
.aviso-acao .x{color:rgba(255,255,255,.8);}
.aviso-acao .x:hover{background:rgba(255,255,255,.15); color:#fff;}
.escolhas-linha{flex-direction:row; flex-wrap:wrap;}
.escolhas-linha .escolha > span{padding:8px 12px;}
.escolha-btn{display:flex; flex-direction:column; gap:3px; text-align:left; padding:12px 14px; border:1px solid var(--line-strong); border-radius:var(--r-sm); background:var(--surface); cursor:pointer;}
.escolha-btn span{font-size:14px; color:var(--ink-soft);}
.escolha-btn:hover{border-color:var(--accent); background:var(--accent-soft);}
.mini-lista{display:flex; flex-direction:column; border:1px solid var(--line); border-radius:var(--r); overflow:hidden;}
.mini-item{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 14px; border:none; border-top:1px solid var(--line); background:var(--surface); text-align:left; cursor:pointer; width:100%;}
.mini-item:first-child{border-top:none;}
.mini-item:hover{background:var(--surface-2);}
.mini-item > span:first-child{display:flex; flex-direction:column; gap:2px; min-width:0;}
.mini-item b{font-weight:600;}
.mini-item small{font-size:13.5px; color:var(--ink-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.mini-dir{display:flex; flex-direction:column; align-items:flex-end; gap:4px; flex:none;}

/* ---------------- Início */
.saudacao{font-size:17px; color:var(--ink-2); margin:-4px 0 16px;}
.kpis{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:20px;}
.kpi{display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:16px; border:1px solid var(--line); border-radius:var(--r-lg); background:var(--surface); text-align:left; cursor:pointer;}
.kpi:hover{border-color:var(--line-strong);}
.kpi b{font-size:26px; font-weight:700; font-variant-numeric:tabular-nums; line-height:1.1;}
.kpi span{font-size:14px; color:var(--ink-soft);}
.kpi-alerta{border-color:#F2C2BD; background:var(--danger-soft);}
.kpi-alerta b{color:var(--danger);}
.kpi-ok b{color:var(--ok);}
.inicio-grid{display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:16px; align-items:start;}
.tarefas{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px;}
.tarefa{display:flex; align-items:center; gap:12px; padding:12px; border:1px solid var(--line); border-radius:var(--r); background:var(--surface);}
.tarefa-ico{width:38px; height:38px; border-radius:10px; display:flex; align-items:center; justify-content:center; flex:none; background:var(--hover); color:var(--ink-2);}
.tarefa-danger .tarefa-ico{background:var(--danger-soft); color:var(--danger);}
.tarefa-warn .tarefa-ico{background:var(--warn-soft); color:var(--warn);}
.tarefa-ok .tarefa-ico{background:var(--ok-soft); color:var(--ok);}
.tarefa-accent .tarefa-ico{background:#FBE8EB; color:#9A3A4C;}
.tarefa-txt{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px;}
.tarefa-txt b{font-weight:600;}
.tarefa-txt small{font-size:14px; color:var(--ink-soft); overflow-wrap:anywhere;}
.tarefa-acoes{display:flex; gap:4px; align-items:center; flex:none;}
.tudo-certo{display:flex; align-items:center; gap:8px; padding:20px; border-radius:var(--r); background:var(--ok-soft); color:var(--ok); font-weight:600;}

/* ---------------- Conversas */
body[data-aba="conversas"] main.wrap{max-width:none; padding-bottom:16px;}
.conv{display:grid; grid-template-columns:340px minmax(0,1fr); height:calc(100vh - 128px); min-height:520px; border:1px solid var(--line); border-radius:var(--r-lg); background:var(--surface); overflow:hidden;}
.conv-lista{display:flex; flex-direction:column; border-right:1px solid var(--line); min-height:0;}
.conv-lista-topo{display:flex; flex-direction:column; gap:10px; padding:10px 12px 12px; border-bottom:1px solid var(--line);}
.conv-filtros{margin:0;}
.conv-filtros .aba-dia{padding:0 10px; font-size:15px;}
.n-alerta{background:var(--danger) !important; color:#fff !important;}
.conv-lista-topo .busca{flex:none; max-width:none;}
.conv-lista-acoes{display:flex; gap:6px; flex-wrap:wrap;}
.conv-itens{overflow-y:auto; flex:1;}
.conv-vazio{padding:24px 16px; display:flex; align-items:center; gap:8px;}
.conv-item{display:flex; gap:10px; align-items:flex-start; width:100%; padding:12px 14px; border:none; border-bottom:1px solid var(--line); background:transparent; text-align:left; cursor:pointer;}
.conv-item:hover{background:var(--surface-2);}
.conv-item.sel{background:var(--accent-soft);}
.conv-item.nao-respondida b{font-weight:700;}
.conv-item-txt{flex:1; min-width:0; display:flex; flex-direction:column; gap:3px;}
.conv-item-l1{display:flex; justify-content:space-between; gap:8px;}
.conv-item-l1 b{font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.conv-item-l1 time{font-size:12.5px; color:var(--ink-soft); flex:none;}
.conv-item-msg{font-size:14px; color:var(--ink-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.conv-item-l3{display:flex; justify-content:space-between; align-items:center; gap:8px;}
.conv-item-l3 small{font-size:12.5px; color:var(--ink-soft);}
.conv-selo{display:inline-flex; align-items:center; gap:4px; font-size:12.5px; font-weight:600; padding:1px 8px; border-radius:99px; background:var(--hover); color:var(--ink-soft);}
.conv-selo .ico{width:13px; height:13px;}
.conv-nova{background:var(--ok-soft); color:var(--ok);}
.conv-atencao{background:var(--warn-soft); color:var(--warn);}
.conv-atrasada{background:var(--danger-soft); color:var(--danger);}
.conv-ok{background:var(--ok-soft); color:var(--ok);}
.conv-vazia-painel{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:var(--ink-soft); text-align:center; padding:24px;}
.conv-vazia-painel h3{font-size:18px; color:var(--ink-2);}
.conv-aberta{display:flex; flex-direction:column; min-height:0; min-width:0;}
.conv-topo{display:flex; align-items:center; gap:10px; padding:10px 14px; border-bottom:1px solid var(--line);}
.conv-voltar{display:none;}
.conv-quem{flex:1; min-width:0; display:flex; flex-direction:column;}
.conv-quem b{font-size:16px;}
.conv-quem small{font-size:13.5px; color:var(--ink-soft);}
.conv-topo-acoes{display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end;}
.conv-corpo{flex:1; display:grid; grid-template-columns:minmax(0,1fr) 250px; min-height:0;}
.conv-msgs{overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:8px; background:var(--surface-2);}
.bolha{max-width:min(78%,520px); padding:9px 12px 6px; border-radius:12px; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.45; font-size:15px; box-shadow:var(--sombra);}
.bolha time{display:block; text-align:right; font-size:11.5px; color:var(--ink-soft); margin-top:3px;}
.bolha-cliente{align-self:flex-start; background:#fff; border-bottom-left-radius:3px;}
.bolha-loja{align-self:flex-end; background:#DDF3E3; border-bottom-right-radius:3px;}
.bolha-nota{align-self:center; max-width:90%; background:var(--warn-soft); font-size:14px;}
.bolha-nota b{display:block; font-size:12.5px; color:var(--warn); margin-bottom:2px;}
.conv-lado{border-left:1px solid var(--line); padding:14px; display:flex; flex-direction:column; gap:8px; overflow-y:auto; font-size:14.5px;}
.conv-lado .bloco-titulo{font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); margin-top:6px;}
.conv-pedido{display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:8px 10px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); cursor:pointer; text-align:left;}
.conv-pedido:hover{border-color:var(--accent);}
.conv-escrever{border-top:1px solid var(--line); padding:10px 14px 12px; display:flex; flex-direction:column; gap:8px; background:var(--surface);}
.conv-escrever .textarea{min-height:72px;}
.conv-escrever-acoes{display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap;}
.conv-escrever-acoes .grupo{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.conv-aviso{display:flex; gap:6px; align-items:center; font-size:13px; color:var(--ink-soft);}
.conv-aviso .ico{width:14px; height:14px;}
.sugestoes{display:flex; gap:8px; overflow-x:auto; padding-bottom:2px; align-items:stretch;}
.sugestoes-tit{display:flex; align-items:center; gap:5px; font-size:13px; font-weight:700; color:var(--accent); flex:none;}
.sugestoes-tit .ico{width:16px; height:16px;}
.sugestao{flex:0 0 240px; display:flex; flex-direction:column; gap:3px; text-align:left; padding:8px 10px; border:1px solid #E6CFC9; border-radius:var(--r-sm); background:var(--accent-soft); cursor:pointer; font-size:13px; color:var(--ink-2);}
.sugestao b{font-size:13.5px; color:var(--accent);}
.sugestao:hover{border-color:var(--accent);}
.tags-cli{display:flex; flex-wrap:wrap; gap:4px;}
.tag-cli{font-size:12px; font-weight:600; padding:1px 8px; border-radius:99px; background:var(--hover); color:var(--ink-2);}

/* ---------------- Clientes */
.cli-filtros{margin-bottom:12px;}
.conta-lista{margin-left:auto;}
.tabela-clientes tbody tr{cursor:pointer;}
.tabela-clientes tbody tr:hover{background:var(--surface-2);}
.tabela-clientes td{padding:10px 14px;}
.tabela-clientes th{padding:10px 14px;}
.tabela-clientes th.num,.tabela-clientes td.num{text-align:right;}
.cli-nome{display:flex; align-items:center; gap:10px; min-width:0;}
.cli-nome > span:last-child{display:flex; flex-direction:column; min-width:0;}
.cli-nome small{font-size:13.5px; color:var(--ink-soft);}
.bloco-sm{display:block; font-size:12.5px;}
.numeros{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px;}
.numeros > div{display:flex; flex-direction:column; padding:10px 12px; border-radius:var(--r-sm); background:var(--surface-2); border:1px solid var(--line);}
.numeros b{font-size:17px; font-variant-numeric:tabular-nums;}
.numeros span{font-size:13px; color:var(--ink-soft);}
.data-linha{display:grid; grid-template-columns:minmax(0,1fr) 76px 90px 32px; gap:8px; margin-bottom:8px; align-items:center;}

/* ---------------- Ajustes */
.ajustes{display:grid; grid-template-columns:230px minmax(0,1fr); gap:24px; align-items:start;}
.aj-nav{display:flex; flex-direction:column; gap:2px; position:sticky; top:16px;}
.aj-grupo{font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-soft); padding:14px 12px 6px;}
.aj-grupo:first-child{padding-top:0;}
.aj-item{display:flex; align-items:center; gap:10px; min-height:40px; padding:0 12px; border:none; border-radius:var(--r-sm); background:transparent; color:var(--ink-2); font-size:15px; font-weight:500; cursor:pointer; text-align:left;}
.aj-item .ico{width:17px; height:17px; color:var(--ink-soft);}
.aj-item:hover{background:var(--hover); color:var(--ink);}
.aj-item[aria-current="page"]{background:var(--surface); color:var(--accent); font-weight:600; box-shadow:var(--sombra); border:1px solid var(--line);}
.aj-item[aria-current="page"] .ico{color:var(--accent);}
.aj-conteudo{min-width:0;}
.aj-conteudo .sub-abas{margin-bottom:16px;}
.ia-grid{display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:16px; align-items:start;}
.ia-editor{display:flex; flex-direction:column; gap:12px;}
.ia-texto{min-height:420px; font-size:14.5px; line-height:1.55;}
.ia-lado{display:flex; flex-direction:column; gap:16px;}
.ia-lado .card{display:flex; flex-direction:column; gap:10px;}
.ia-resultado{display:flex; flex-direction:column; gap:8px;}
.ia-sug{padding:10px 12px; border-radius:var(--r-sm); background:#DDF3E3;}
.ia-sug small{display:block; font-size:12.5px; font-weight:600; color:#1F6B3A; margin-bottom:3px;}
.ia-sug p{white-space:pre-wrap; font-size:14.5px;}
.lista-auto{display:flex; flex-direction:column; gap:10px;}
.auto{display:flex; gap:14px; align-items:flex-start; padding:16px;}
.auto .switch{min-height:auto; padding-top:2px;}
.auto-off .auto-txt{opacity:.6;}
.auto-txt{display:flex; flex-direction:column; gap:4px; flex:1;}
.auto-txt p{color:var(--ink-2); line-height:1.7;}
.input-num{display:inline-block; width:74px; min-height:34px; padding:4px 8px; text-align:center; margin:0 2px;}
.auto-msg{display:flex; align-items:center; gap:8px; font-size:14px; color:var(--ink-soft); flex-wrap:wrap;}
.integ{display:flex; flex-direction:column; gap:14px;}
.integ-status{display:flex; gap:12px; align-items:flex-start; padding:14px; border-radius:var(--r); background:var(--surface-2); border:1px solid var(--line);}
.integ-bolinha{width:12px; height:12px; border-radius:50%; background:var(--line-strong); margin-top:6px; flex:none;}
.integ-bolinha.on{background:#1F8A4C;}

/* ---------------- Tour */
.tour{position:fixed; inset:0; z-index:300;}
.tour-centro{background:rgba(27,23,24,.45);}
.tour-foco{position:fixed; border-radius:10px; box-shadow:0 0 0 9999px rgba(27,23,24,.45); outline:3px solid var(--accent); transition:all .2s ease; pointer-events:none;}
.tour-caixa{position:fixed; background:var(--surface); border-radius:var(--r-lg); box-shadow:var(--sombra-alta); padding:18px; display:flex; flex-direction:column; gap:8px;}
.tour-caixa h2{font-size:18px; font-weight:700;}
.tour-caixa p{color:var(--ink-2); line-height:1.5;}
.tour-passo{font-size:13px !important; color:var(--ink-soft) !important;}
.tour-acoes{display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:6px;}
.tour-acoes .grupo{display:flex; gap:6px;}

/* ---------------- telas menores */
@media (max-width:1279px){
  .conv{grid-template-columns:300px minmax(0,1fr);}
  .conv-corpo{grid-template-columns:minmax(0,1fr);}
  .conv-lado{display:none;}
}
@media (max-width:1023px){
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr));}
  .inicio-grid,.ia-grid{grid-template-columns:minmax(0,1fr);}
  .ajustes{grid-template-columns:1fr; gap:12px;}
  .aj-nav{position:static; flex-direction:row; overflow-x:auto; gap:4px; padding-bottom:4px; scrollbar-width:none;}
  .aj-nav::-webkit-scrollbar{display:none;}
  .aj-grupo{display:none;}
  .aj-item{flex:none; white-space:nowrap; border:1px solid var(--line); background:var(--surface);}
  .conv{grid-template-columns:1fr; height:calc(100vh - 120px);}
  .conv.com-aberta .conv-lista{display:none;}
  .conv:not(.com-aberta) .conv-aberta,.conv:not(.com-aberta) .conv-vazia-painel{display:none;}
  .conv-voltar{display:inline-flex;}
  .tabela-clientes th:nth-child(4),.tabela-clientes td:nth-child(4){display:none;}
}
@media (max-width:599px){
  .kpi b{font-size:21px;}
  .kpi{padding:12px;}
  .tarefa{flex-wrap:wrap;}
  .tarefa-acoes{width:100%; justify-content:flex-end;}
  .conv{height:calc(100vh - 190px - env(safe-area-inset-bottom,0px)); border-radius:var(--r); margin:0 -8px;}
  .conv-topo-acoes .btn span{display:none;}
  .sugestao{flex-basis:200px;}
  .numeros{grid-template-columns:repeat(2,minmax(0,1fr));}
  .tabela-clientes th:nth-child(3),.tabela-clientes td:nth-child(3),.tabela-clientes th:nth-child(5),.tabela-clientes td:nth-child(5){display:none;}
  .tabela-clientes td{padding:10px;}
  .data-linha{grid-template-columns:minmax(0,1fr) 70px 80px 32px;}
  .nav-item{font-size:11.5px; min-height:52px; padding:6px 2px;}
  .nav-item .badge-n{position:absolute; top:2px; right:calc(50% - 22px); min-width:18px; height:18px; font-size:11px; padding:0 5px;}
  .nav-item{position:relative; flex-direction:column; gap:3px;}
}
/* conversa aberta no celular: mais espaço para as mensagens */
.sugestao span{display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
@media (max-width:1023px){
  body[data-aba="conversas"]:has(.conv.com-aberta) .barra-topo{display:none;}
  .conv{height:calc(100dvh - 120px);}
}
@media (max-width:599px){
  .conv{height:calc(100dvh - 150px - env(safe-area-inset-bottom,0px));}
  body[data-aba="conversas"]:has(.conv.com-aberta) .conv{height:calc(100dvh - 140px - env(safe-area-inset-bottom,0px));}
  .sugestoes-tit{display:none;}
  .sugestao{flex-basis:220px; padding:6px 9px;}
  .sugestao span{-webkit-line-clamp:2;}
  .conv-aviso{display:none;}
  .conv-escrever .textarea{min-height:52px; height:52px;}
  .conv-escrever{padding:8px 10px;}
  .conv-msgs{padding:10px;}
}
.conv-escrever-acoes > a,.conv-escrever-acoes > button[type=submit]{margin-left:auto;}