/* SL Hub · identidade SL Tecnologia */
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("fontes/montserrat-latin-400-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("fontes/montserrat-latin-ext-400-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("fontes/montserrat-latin-500-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("fontes/montserrat-latin-ext-500-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("fontes/montserrat-latin-600-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("fontes/montserrat-latin-ext-600-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("fontes/montserrat-latin-700-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 700; font-display: swap;
  src: url("fontes/montserrat-latin-ext-700-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 800; font-display: swap;
  src: url("fontes/montserrat-latin-800-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Montserrat"; font-style: normal; font-weight: 800; font-display: swap;
  src: url("fontes/montserrat-latin-ext-800-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --azul: #074056;
  --azul-2: #0a5670;
  --verde: #00a8a8;
  --verde-escuro: #008584;
  --cinza: #737373;
  --degrade: linear-gradient(118deg, #074056 0%, #075c70 48%, #00a8a8 100%);
  --degrade-botao: linear-gradient(118deg, #00a8a8 0%, #068f97 45%, #074056 100%);

  --fundo: #f1f5f6;
  --superficie: #ffffff;
  --tinta: #0d2c38;
  --tinta-2: #5b6a70;
  --linha: #dbe4e6;
  --linha-forte: #bccbcf;

  --s-azul: #1d5ea8;   --s-azul-c: #e8f0fb;
  --s-ambar: #915b00;  --s-ambar-c: #fcf0d9;
  --s-teal: #00797a;   --s-teal-c: #dcf3f2;
  --s-verde: #1b7a3e;  --s-verde-c: #e3f4e8;
  --s-verm: #b42318;   --s-verm-c: #fdecea;
  --s-cinza: #6b7477;  --s-cinza-c: #eef1f2;
  --s-lemb: #6a45b0;   --s-lemb-c: #f1ecfa;

  --raio: 12px;
  --raio-peq: 8px;
  --sombra: 0 1px 2px rgba(7, 64, 86, .06), 0 4px 14px rgba(7, 64, 86, .05);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; background: var(--fundo); color: var(--tinta);
  font: 400 15px/1.55 "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  min-height: 100vh;
}
a { color: var(--verde-escuro); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3 { margin: 0; line-height: 1.2; color: var(--azul); }
h1 { font-size: 1.6rem; font-weight: 800; letter-spacing: -0.02em; }
h2 { font-size: 1.08rem; font-weight: 700; margin-bottom: 14px; }
h3 { font-size: .92rem; font-weight: 700; margin: 20px 0 6px; color: var(--tinta-2); }
p { margin: 0 0 10px; }
code { background: var(--s-cinza-c); padding: 1px 6px; border-radius: 4px; font-size: .88em; }
mark { background: var(--s-teal-c); color: var(--s-teal); border-radius: 3px; padding: 0 2px; font-weight: 600; }
:focus-visible { outline: 3px solid rgba(0, 168, 168, .55); outline-offset: 2px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Topo ---------- */
.topo {
  /* Branco à esquerda (logomarca) passando para o verde-água e o azul da SL */
  --branco-ate: max(270px, calc(50% - 620px + 280px));
  --verde-em: max(460px, calc(50% - 620px + 470px));
  background: linear-gradient(90deg, #fff 0, #fff var(--branco-ate), #00a8a8 var(--verde-em), #074056 100%);
  color: #fff; position: sticky; top: 0; z-index: 50; overflow: hidden;
  box-shadow: 0 1px 0 rgba(7,64,86,.08), 0 2px 10px rgba(7,64,86,.08);
}
.topo::after {
  content: ""; position: absolute; right: -120px; top: -160px; width: 420px; height: 420px; pointer-events: none;
  background: repeating-radial-gradient(circle, rgba(255,255,255,.10) 0 1px, transparent 1px 34px);
  border-radius: 50%;
}
.topo-in {
  position: relative; z-index: 1; max-width: 1240px; margin: 0 auto; padding: 0 20px;
  display: flex; align-items: center; gap: 18px; min-height: 64px;
}
.marca { display: flex; align-items: flex-end; gap: 12px; color: var(--azul); font-size: 1.15rem; letter-spacing: -0.01em; margin-right: auto; }
.marca:hover { text-decoration: none; }
.marca-nome { font-family: "Montserrat", sans-serif; font-size: 1.2rem; letter-spacing: -0.01em; }
.marca-nome b { font-weight: 700; color: var(--azul); }
.marca-nome strong { font-weight: 800; color: var(--verde-escuro); }
.marca-hub { display: inline-flex; align-items: center; }
.marca-hub img { height: 40px; width: auto; display: block; margin-bottom: 7px; }
.marca-sep { flex-shrink: 0; width: 1px; height: 34px; background: var(--linha-forte); display: inline-block; margin-bottom: 8px; }
.marca-logo { display: inline-flex; align-items: flex-end; }
.marca-logo img { height: 46px; width: auto; display: block; }
.marca-icone {
  display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 10px;
  background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.25);
}
.menu { display: flex; align-items: center; gap: 2px; }
.menu a {
  color: rgba(255,255,255,.82); padding: 8px 12px; border-radius: var(--raio-peq);
  font-weight: 600; font-size: .9rem; white-space: nowrap;
}
.menu a:hover { background: rgba(255,255,255,.12); color: #fff; text-decoration: none; }
.menu a.ativo { background: rgba(255,255,255,.2); color: #fff; }
.menu-sep { width: 1px; height: 26px; background: rgba(255,255,255,.25); margin: 0 6px; }
.menu-usuario { display: inline-flex; align-items: center; gap: 8px; }
.avatar {
  display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%;
  background: #fff; color: var(--azul); font-weight: 800; font-size: .82rem;
}
.menu a.sair { color: rgba(255,255,255,.65); }
.contador {
  display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 4px; border-radius: 10px;
  background: #fff; color: var(--azul); font-size: .74rem; font-weight: 800; text-align: center; line-height: 20px;
}
.menu-botao {
  display: none; width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.3); border-radius: var(--raio-peq);
  background: rgba(255,255,255,.1); cursor: pointer; padding: 10px; flex-direction: column; justify-content: space-between;
}
.menu-botao span { display: block; height: 2px; background: #fff; border-radius: 2px; transition: transform .2s, opacity .2s; }
.menu-botao[aria-expanded="true"] span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.menu-botao[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-botao[aria-expanded="true"] span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

.conteudo { max-width: 1240px; margin: 0 auto; padding: 28px 20px 70px; }

.titulo-pagina { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 22px; flex-wrap: wrap; }
.titulo-pagina p { margin: 4px 0 0; }
.mudo { color: var(--tinta-2); }
.peq { font-size: .84rem; }
.forte { font-weight: 700; color: var(--tinta); }
.sub { display: block; font-size: .82rem; color: var(--tinta-2); font-weight: 400; }
.txt-erro { color: var(--s-verm); font-weight: 600; }
.txt-alerta { color: var(--s-ambar); font-weight: 600; }
.voltar { display: inline-block; margin-bottom: 10px; font-weight: 600; }
.contagem { margin: 0 0 8px; }

/* ---------- Botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: 1px solid transparent; border-radius: var(--raio-peq); padding: 10px 16px;
  font: inherit; font-weight: 700; font-size: .88rem; cursor: pointer; white-space: nowrap;
  text-decoration: none; line-height: 1.2; min-height: 40px;
}
.btn:hover { text-decoration: none; }
.btn-pri { background: var(--degrade-botao); background-size: 140% 100%; background-position: 0 0; color: #fff; transition: background-position .25s; }
.btn-pri:hover { background-position: 100% 0; }
.btn-sec { background: var(--superficie); color: var(--azul); border-color: var(--linha-forte); }
.btn-sec:hover { background: #f4f8f9; border-color: var(--verde); }
.btn-perigo { background: var(--superficie); color: var(--s-verm); border-color: #efc5c1; }
.btn-perigo:hover { background: var(--s-verm-c); }
.btn-peq { padding: 6px 11px; font-size: .8rem; min-height: 32px; }
.btn-largo { width: 100%; }
.btn[disabled] { opacity: .6; cursor: progress; }
.btn-icone {
  display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: var(--raio-peq);
  border: 1px solid var(--linha-forte); color: var(--azul); font-size: 1.5rem; line-height: 1; background: #fff;
}
.btn-icone:hover { border-color: var(--verde); text-decoration: none; }
.form-inline { display: inline; margin: 0; }
.grupo-botoes { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }

/* ---------- Cartões e avisos ---------- */
.cartao {
  background: var(--superficie); border: 1px solid var(--linha); border-radius: var(--raio);
  padding: 20px; margin-bottom: 18px; box-shadow: var(--sombra);
}
.cartao-topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 14px; }
.cartao-topo h2 { margin: 0; }
.aviso { padding: 12px 16px; border-radius: var(--raio-peq); margin-bottom: 16px; font-weight: 600; border: 1px solid; font-size: .92rem; }
.aviso-ok { background: var(--s-verde-c); color: var(--s-verde); border-color: #bfe2ca; }
.aviso-erro { background: var(--s-verm-c); color: var(--s-verm); border-color: #f2c6c2; }
.aviso-info { background: var(--s-teal-c); color: var(--azul); border-color: #b5e3e2; font-weight: 500; }
.vazio { color: var(--tinta-2); margin: 6px 0; }
.cartao.vazio { text-align: center; padding: 40px 20px; }

/* ---------- Indicadores ---------- */
.indicadores {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-bottom: 18px;
  background: var(--superficie); border: 1px solid var(--linha); border-radius: var(--raio); overflow: hidden; box-shadow: var(--sombra);
  position: relative;
}
.indicadores::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--degrade); }
.ind { padding: 20px 20px 16px; display: flex; flex-direction: column; color: var(--tinta); border-left: 1px solid var(--linha); }
.ind:first-child { border-left: 0; }
a.ind:hover { background: #f6fafb; text-decoration: none; }
.ind-num { font-size: 2rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; color: var(--azul); font-variant-numeric: tabular-nums; }
.ind-rot { color: var(--tinta-2); font-size: .84rem; margin-top: 2px; }
.ind-alerta .ind-num { color: var(--s-verm); }

/* ---------- Envio em um clique ---------- */
.btn-wa { background: #128c4a; color: #fff; }
.btn-wa:hover { background: #0e743d; }
.btn-wa svg { flex-shrink: 0; }
.para-enviar { border-radius: var(--raio); padding: 18px 20px; margin-bottom: 18px; background: var(--superficie); border: 1px solid var(--linha); box-shadow: var(--sombra); }
.para-enviar.tem { background: var(--degrade); border: 0; color: #fff; }
.para-enviar-topo h2 { margin: 0 0 4px; display: flex; align-items: center; gap: 10px; font-size: 1.1rem; }
.para-enviar.tem h2 { color: #fff; }
.para-enviar-topo p { margin: 0; font-size: .9rem; color: var(--tinta-2); }
.para-enviar.tem .para-enviar-topo p { color: rgba(255,255,255,.88); }
.contador-grande { display: inline-grid; place-items: center; min-width: 30px; height: 30px; padding: 0 8px; border-radius: 15px; background: #fff; color: var(--azul); font-weight: 800; font-size: .95rem; }
.para-enviar-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; margin-top: 14px; }
.envio { background: #fff; color: var(--tinta); border-radius: var(--raio-peq); padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; }
.envio-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.envio-texto { font-size: .84rem; color: var(--tinta); background: #e9f6ee; border-radius: 4px 12px 12px 12px; padding: 8px 10px; margin: 8px 0 10px; }
.chip-botao { font: inherit; font-size: .8rem; font-weight: 600; padding: 6px 12px; border-radius: 999px; border: 1px dashed var(--verde); background: #f1fbfb; color: var(--verde-escuro); cursor: pointer; }
.chip-botao:hover { background: var(--s-teal-c); }

/* ---------- Respostas na agenda ---------- */
.faixa-respostas { background: var(--degrade); border-radius: var(--raio); padding: 16px 18px; margin-bottom: 18px; color: #fff; }
.faixa-respostas-topo { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 10px; }
.faixa-respostas h2 { color: #fff; margin: 0; font-size: 1rem; }
.faixa-respostas-topo a { color: #fff; font-weight: 600; font-size: .86rem; }
.faixa-respostas-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.resposta-mini { background: rgba(255,255,255,.95); color: var(--tinta); border-radius: var(--raio-peq); padding: 10px 12px; display: flex; flex-direction: column; gap: 2px; }
.resposta-mini:hover { text-decoration: none; background: #fff; }
.resposta-mini strong { color: var(--azul); font-size: .88rem; }
.resposta-mini span { font-size: .85rem; }
.resposta-mini small { color: var(--tinta-2); font-size: .74rem; }
.resposta-mini.saida strong { color: var(--s-verm); }

/* ---------- Agenda ---------- */
.agenda-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 18px; align-items: start; }
.calendario { padding: 18px; }
.cal-topo { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.cal-topo h2 { margin: 0 4px; min-width: 160px; text-align: center; font-size: 1.15rem; }
.cal-hoje { margin-left: auto; }
.cal-grade { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
.cal-sem { font-size: .76rem; font-weight: 700; color: var(--tinta-2); padding: 2px 6px; }
.cal-dia {
  min-height: 100px; padding: 6px; border-radius: var(--raio-peq); border: 1px solid var(--linha);
  background: #fff; color: var(--tinta); display: flex; flex-direction: column; gap: 4px; overflow: hidden;
}
.cal-dia:hover { border-color: var(--verde); text-decoration: none; }
.cal-dia.fora { background: transparent; border-color: transparent; color: #a3b0b4; }
.cal-dia.fora .chip { opacity: .5; }
.cal-dia.hoje .cal-num { background: var(--degrade); color: #fff; }
.cal-dia.sel { border: 2px solid var(--verde); padding: 5px; background: #f1fbfb; }
.cal-num { font-size: .84rem; font-weight: 700; width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; font-variant-numeric: tabular-nums; }
.cal-itens { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cal-pontos { display: none; }
.chip {
  display: block; font-size: .72rem; font-weight: 600; line-height: 1.35; padding: 2px 6px; border-radius: 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-left: 3px solid;
}
.chip.mais { background: var(--s-cinza-c); color: var(--s-cinza); border-left-color: var(--s-cinza); }
.chip.venc { background: #fff; color: var(--azul); border: 1px dashed var(--azul); font-weight: 700; }
.legenda { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 14px; font-size: .8rem; color: var(--tinta-2); }

.s-pendente  { background: var(--s-azul-c); color: var(--s-azul); border-color: var(--s-azul); }
.s-pausado   { background: var(--s-ambar-c); color: var(--s-ambar); border-color: var(--s-ambar); }
.s-enviado   { background: var(--s-teal-c); color: var(--s-teal); border-color: var(--verde); }
.s-entregue, .s-lido { background: var(--s-verde-c); color: var(--s-verde); border-color: var(--s-verde); }
.s-erro      { background: var(--s-verm-c); color: var(--s-verm); border-color: var(--s-verm); }
.s-cancelado { background: var(--s-cinza-c); color: var(--s-cinza); border-color: var(--s-cinza); }

.ponto { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }
.ponto.s-pendente { background: var(--s-azul); }
.ponto.s-pausado { background: #d89a1d; }
.ponto.s-enviado { background: var(--verde); }
.ponto.s-entregue, .ponto.s-lido { background: var(--s-verde); }
.ponto.s-erro { background: var(--s-verm); }
.ponto.s-cancelado { background: var(--s-cinza); }
.ponto.venc { background: #fff; border: 2px solid var(--azul); }

.selo { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: .74rem; font-weight: 700; white-space: nowrap; border: 1px solid; line-height: 1.6; }
.selos { display: flex; gap: 6px; flex-wrap: wrap; }
.c-ativo     { background: var(--s-verde-c); color: var(--s-verde); border-color: #bfe2ca; }
.c-pausado   { background: var(--s-ambar-c); color: var(--s-ambar); border-color: #efd29b; }
.c-renovado  { background: var(--s-azul-c); color: var(--s-azul); border-color: #c4d6f0; }
.c-cancelado { background: var(--s-cinza-c); color: var(--s-cinza); border-color: var(--linha); }
.neutro      { background: var(--s-cinza-c); color: var(--s-cinza); border-color: var(--linha); }
.p-admin     { background: var(--azul); color: #fff; border-color: var(--azul); }
.p-operador  { background: var(--s-teal-c); color: var(--s-teal); border-color: #a9dedd; }
.p-consulta  { background: var(--s-cinza-c); color: var(--s-cinza); border-color: var(--linha); }
td .selo + .selo { margin-left: 4px; }

.dia-painel { position: sticky; top: 84px; max-height: calc(100vh - 100px); overflow: auto; }
.dia-painel h2 { font-size: 1.15rem; margin-bottom: 2px; }
.item { padding: 14px 0; border-top: 1px solid var(--linha); }
h3 + .item { border-top: 0; padding-top: 6px; }
.item-topo { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; margin-bottom: 2px; }
.item-nome { font-weight: 700; color: var(--azul); }
.item-info { font-size: .84rem; color: var(--tinta-2); margin: 1px 0; }
.item-erro { font-size: .82rem; color: var(--s-verm); margin: 4px 0 0; font-weight: 600; }
.item .grupo-botoes { margin-top: 10px; }

/* ---------- Listas e tabelas ---------- */
.busca { display: flex; gap: 8px; margin-bottom: 12px; }
.busca input { flex: 1; }
.abas { display: flex; gap: 2px; margin-bottom: 14px; overflow-x: auto; border-bottom: 1px solid var(--linha); scrollbar-width: thin; }
.abas a { padding: 10px 14px; color: var(--tinta-2); font-weight: 600; font-size: .88rem; white-space: nowrap; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.abas a:hover { color: var(--azul); text-decoration: none; }
.abas a.ativo { color: var(--azul); border-image: var(--degrade) 1; border-bottom: 3px solid; }

.tabela-cartao { padding: 0; overflow-x: auto; }
.tabela-cartao.embutida { margin: 0 -20px -20px; border-top: 1px solid var(--linha); }
.tabela { width: 100%; border-collapse: collapse; font-size: .88rem; }
.tabela th { text-align: left; font-weight: 700; font-size: .76rem; color: var(--tinta-2); padding: 11px 14px; border-bottom: 1px solid var(--linha); background: #f7fafb; white-space: nowrap; }
.tabela td { padding: 12px 14px; border-bottom: 1px solid var(--linha); vertical-align: top; }
.tabela tbody tr:last-child td { border-bottom: 0; }
.tabela-clicavel tbody tr { cursor: pointer; }
.tabela-clicavel tbody tr:hover { background: #f5fafb; }
.linha-inativa td { opacity: .6; }
.celula-acoes { text-align: right; }
.celula-acoes .grupo-botoes { justify-content: flex-end; }

/* ---------- Detalhe ---------- */
.duas-colunas { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; margin-bottom: 18px; }
.duas-colunas > .cartao, .duas-colunas > div > .cartao:last-child { margin-bottom: 0; }
.duas-colunas > div > .cartao { margin-bottom: 18px; }
.duas-colunas.larga-esquerda { grid-template-columns: minmax(0, 1.6fr) minmax(300px, 1fr); }
.dados { display: grid; grid-template-columns: 160px 1fr; gap: 9px 14px; margin: 0; }
.dados dt { color: var(--tinta-2); font-size: .84rem; padding-top: 1px; }
.dados dd { margin: 0; }
.marca-editado { display: inline-block; margin-left: 6px; font-size: .68rem; font-weight: 700; color: var(--s-ambar); background: var(--s-ambar-c); border-radius: 4px; padding: 0 5px; vertical-align: 1px; }
.link-wa { margin-left: 8px; font-size: .82rem; font-weight: 600; }
.observacoes { margin-top: 16px; padding: 12px 14px; background: #f7fafb; border-radius: var(--raio-peq); border-left: 3px solid var(--verde); font-size: .9rem; }
.observacoes span { display: block; font-size: .76rem; font-weight: 700; color: var(--tinta-2); margin-bottom: 4px; }
.lista-acoes { display: flex; flex-direction: column; gap: 8px; }
.lista-acoes .form-inline .btn, .lista-acoes > .btn { width: 100%; justify-content: flex-start; }

.conversa { list-style: none; padding: 0; margin: 0 0 14px; display: flex; flex-direction: column; gap: 8px; }
.conversa li { background: #f2f6f7; border-radius: 4px 14px 14px 14px; padding: 10px 14px; max-width: 560px; }
.conversa li.saida { background: var(--s-verm-c); }
.conversa p { margin: 0 0 2px; }
.conversa small { color: var(--tinta-2); font-size: .74rem; }

.linha-tempo { list-style: none; padding: 0; margin: 0; max-height: 420px; overflow: auto; font-size: .85rem; }
.linha-tempo li { display: grid; grid-template-columns: 128px 1fr auto; gap: 12px; padding: 8px 0 8px 14px; border-top: 1px solid var(--linha); position: relative; }
.linha-tempo li::before { content: ""; position: absolute; left: 0; top: 15px; width: 6px; height: 6px; border-radius: 50%; background: var(--linha-forte); }
.linha-tempo li:first-child { border-top: 0; }
.lt-envio::before { background: var(--verde) !important; }
.lt-erro::before { background: var(--s-verm) !important; }
.lt-resposta::before { background: var(--s-verde) !important; }
.lt-erro .lt-texto { color: var(--s-verm); }
.lt-quando { color: var(--tinta-2); font-variant-numeric: tabular-nums; }
.lt-quem { color: var(--tinta-2); font-size: .78rem; white-space: nowrap; }

/* ---------- Mensagem / prévia ---------- */
.celular-previa { background: #e9e4dc; background-image: radial-gradient(rgba(7,64,86,.06) 1px, transparent 1px); background-size: 14px 14px; border-radius: var(--raio); padding: 18px; }
.balao { background: #fff; border-radius: 4px 14px 14px 14px; padding: 12px 14px; max-width: 420px; line-height: 1.55; color: #1b2a2f; box-shadow: 0 1px 1px rgba(0,0,0,.08); white-space: pre-wrap; font-size: .92rem; }
.balao em { font-style: normal; background: var(--s-teal-c); color: var(--s-teal); border-radius: 3px; padding: 0 2px; }

/* ---------- Formulários ---------- */
.form { display: flex; flex-direction: column; gap: 14px; }
.form label { display: flex; flex-direction: column; gap: 6px; font-weight: 600; font-size: .86rem; color: var(--tinta); }
.form small { color: var(--tinta-2); font-weight: 400; font-size: .78rem; }
.form > .btn { align-self: flex-start; }
.form > .btn-largo { align-self: stretch; }
.form-largo { max-width: 860px; }
.grade-campos { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.span-2 { grid-column: span 2; }
.linha-campos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
legend { font-weight: 700; font-size: .86rem; margin-bottom: 8px; padding: 0; color: var(--azul); }
input, select, textarea {
  font: inherit; font-size: .92rem; color: var(--tinta); background: #fff; border: 1px solid var(--linha-forte);
  border-radius: var(--raio-peq); padding: 10px 12px; width: 100%; min-height: 42px; font-weight: 500;
}
textarea { resize: vertical; line-height: 1.5; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--verde); box-shadow: 0 0 0 3px rgba(0,168,168,.18); }
input[readonly] { background: #f6f9fa; }

.chip-check { display: inline-flex !important; flex-direction: row !important; cursor: pointer; }
.chip-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chip-check span { display: inline-block; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--linha-forte); font-weight: 600; font-size: .8rem; color: var(--tinta-2); background: #fff; user-select: none; }
.chip-check input:checked + span { background: var(--degrade-botao); color: #fff; border-color: transparent; }
.chip-check input:focus-visible + span { outline: 3px solid rgba(0,168,168,.55); outline-offset: 2px; }
.dias-semana, .chips { display: flex; flex-wrap: wrap; gap: 6px; }
.dias-semana legend { width: 100%; }
.check { flex-direction: row !important; align-items: center; gap: 8px !important; font-weight: 500 !important; cursor: pointer; }
.check input { width: 18px; height: 18px; min-height: 0; accent-color: var(--verde); }
.rotulo-grupo { font-weight: 600; font-size: .82rem; margin: 12px 0 6px; }

.checklist { list-style: none; padding: 0; margin: 0 0 10px; font-size: .9rem; }
.checklist li { padding: 6px 0 6px 26px; position: relative; }
.checklist li::before { content: ""; position: absolute; left: 0; top: 10px; width: 14px; height: 14px; border-radius: 50%; }
.checklist li.ok::before { background: var(--verde); }
.checklist li.pend::before { border: 2px solid #d89a1d; }
.bloco-codigo { display: block; padding: 12px 14px; margin: 8px 0 12px; background: var(--azul); color: #cdeff0; border-radius: var(--raio-peq); word-break: break-all; font-size: .82rem; }
.passos { padding-left: 20px; margin: 12px 0; font-size: .9rem; }
.passos li { margin-bottom: 6px; }
.copiar { display: flex; gap: 8px; margin: 12px 0; }
.copiar input { font-size: .8rem; }

.regras { display: grid; grid-template-columns: 1fr auto; gap: 8px 10px; align-items: center; margin-bottom: 12px; }
.regra { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--linha); border-radius: var(--raio-peq); background: #fafcfc; margin: 0; }
.regra.inativa { opacity: .6; }
.regra label { flex-direction: row; align-items: center; gap: 8px; font-weight: 600; font-size: .86rem; display: flex; }
.regra-dias input { width: 78px; }
.regra-modelo { flex: 1; min-width: 180px; }
.regra-modelo select, .regra-ativo select { min-width: 0; }
.novo-item summary { list-style: none; display: inline-flex; }
.novo-item summary::-webkit-details-marker { display: none; }
.novo-item[open] summary { margin-bottom: 10px; }

.modelos { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.modelo { border: 1px solid var(--linha); border-radius: var(--raio-peq); padding: 14px; background: #fafcfc; }
.modelo.inativo { opacity: .6; }
.modelo-topo { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; margin-bottom: 8px; }
.modelo-corpo { font-size: .86rem; color: var(--tinta-2); margin: 0; }
.variaveis { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; }
.variaveis legend { grid-column: 1 / -1; }
.var-linha { flex-direction: row !important; align-items: center; gap: 8px !important; }
.var-linha span { font-weight: 700; color: var(--verde-escuro); min-width: 40px; font-size: .85rem; }
.niveis { margin: 0; display: grid; gap: 10px; }
.niveis dt { margin: 0; }
.niveis dd { margin: 0 0 4px; font-size: .86rem; color: var(--tinta-2); }

/* ---------- Respostas ---------- */
.lista-respostas { display: grid; gap: 12px; }
.resposta { margin: 0; }
.resposta.nova { border-left: 4px solid var(--verde); }
.resposta.saida { border-left: 4px solid var(--s-verm); }
.resposta-topo { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.resposta-texto { background: #f2f6f7; border-radius: 4px 14px 14px 14px; padding: 10px 14px; display: inline-block; max-width: 100%; }

/* ---------- Relatórios ---------- */
.salvos { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 14px; }
.chip-link { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--linha-forte); background: #fff; font-weight: 600; font-size: .8rem; color: var(--azul); }
.chip-link:hover { border-color: var(--verde); text-decoration: none; }
.chip-link.ativo { background: var(--degrade-botao); color: #fff; border-color: transparent; }
.relatorio-layout { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 18px; align-items: start; }
.montador { position: sticky; top: 84px; max-height: calc(100vh - 100px); overflow: auto; gap: 16px; }
.montador h2 { margin: 0; }
.lista-checks { display: flex; flex-direction: column; gap: 6px; }
.resultado-topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.resultado-topo p { margin: 0; }
.salvar-relatorio { position: relative; }
.salvar-relatorio summary { list-style: none; }
.salvar-relatorio summary::-webkit-details-marker { display: none; }
.flutuante { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; width: 280px; background: #fff; border: 1px solid var(--linha); border-radius: var(--raio); padding: 14px; box-shadow: 0 10px 30px rgba(7,64,86,.15); }
.tabela-relatorio td { white-space: nowrap; }
.cabecalho-impressao { display: none; }

/* ---------- Acesso (login e instalação) ---------- */
body.publico { background: #fff; }
body.publico .conteudo { max-width: none; padding: 0; }
.acesso { min-height: 100vh; display: grid; grid-template-columns: 1.1fr 1fr; }
.acesso-faixa { background: var(--degrade); position: relative; overflow: hidden; display: grid; place-items: center; color: #fff; }
.acesso-faixa::before {
  content: ""; position: absolute; width: 900px; height: 900px; border-radius: 50%;
  background: repeating-radial-gradient(circle, rgba(255,255,255,.09) 0 1px, transparent 1px 60px);
}
.radar-anim { position: relative; opacity: .9; }
.radar-anim svg { display: block; animation: varrer 6s linear infinite; transform-origin: 50% 50%; }
@keyframes varrer { to { transform: rotate(360deg); } }
.acesso-caixa { display: flex; flex-direction: column; justify-content: center; padding: 48px clamp(24px, 6vw, 80px); max-width: 520px; width: 100%; justify-self: center; }
.acesso-marcas { display: flex; align-items: flex-end; gap: 18px; margin: 0 0 18px; }
.acesso-hub { height: 64px; width: auto; margin-bottom: 11px; }
.acesso-marcas .marca-sep { height: 52px; margin-bottom: 13px; flex-shrink: 0; }
.acesso-logo { height: 73px; width: auto; image-rendering: auto; }
.hub-ilustracao { width: min(420px, 90%); height: auto; }
.hub-simbolo { position: relative; display: flex; flex-direction: column; align-items: center; gap: 22px; color: #fff; text-align: center; max-width: 440px; }
.hub-simbolo svg { display: block; opacity: .95; }
.hub-simbolo p { margin: 0; font-size: 1.05rem; font-weight: 600; line-height: 1.45; opacity: .92; }
.acesso-titulo { font-size: 2.1rem; font-weight: 500; letter-spacing: -0.03em; }
.acesso-titulo b { font-weight: 700; color: var(--azul); }
.acesso-titulo strong { font-weight: 800; background: var(--degrade); -webkit-background-clip: text; background-clip: text; color: transparent; }
.acesso-sub { color: var(--tinta-2); margin: 6px 0 26px; }
.acesso h2 { margin-top: 6px; }

/* ---------- Tablet ---------- */

/* ---------- Lembretes ---------- */
.grupo-titulo { font-size: .95rem; margin: 20px 0 10px; }
.grupo-titulo .mudo { font-weight: 500; }
.lista-lembretes { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 10px; margin-bottom: 8px; }
.lista-lembretes.compacta { grid-template-columns: 1fr; }
.lembrete { display: flex; gap: 12px; background: var(--superficie); border: 1px solid var(--linha); border-radius: var(--raio-peq); padding: 14px; box-shadow: var(--sombra); }
.lembrete.feito { opacity: .7; box-shadow: none; }
.lembrete-icone { flex: none; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--s-lemb-c); color: var(--s-lemb); }
.lembrete.aniv .lembrete-icone { background: #fdeef3; color: #b8336a; }
.lembrete-corpo { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.lembrete .grupo-botoes { margin-top: 8px; }
.faixa-lembretes { background: linear-gradient(118deg, #fbf8ff 0%, #f1fbfb 100%); border: 1px solid var(--linha); border-radius: var(--raio); padding: 16px 18px; margin-bottom: 18px; }
.faixa-lembretes h2 { font-size: 1rem; margin: 0; display: flex; align-items: center; gap: 8px; }
.faixa-lembretes .contador-grande { background: var(--s-lemb); color: #fff; }
.faixa-lembretes .faixa-respostas-topo a { color: var(--verde-escuro); font-weight: 600; font-size: .86rem; }
.chip.lemb { background: var(--s-lemb-c); color: var(--s-lemb); border-left-color: var(--s-lemb); }
.ponto.lemb { background: var(--s-lemb); }
.zona-perigo { margin-top: 14px; display: flex; justify-content: flex-end; }

/* ---------- Propostas ---------- */
.indicadores.ind-3 { grid-template-columns: repeat(3, 1fr); }
.tabela .num { text-align: right; white-space: nowrap; }
.itens-proposta { display: flex; flex-direction: column; gap: 10px; }
.item-proposta { border: 1px solid var(--linha); border-radius: var(--raio-peq); padding: 12px; background: #fafcfc; display: flex; flex-direction: column; gap: 8px; }
.item-proposta-topo { display: flex; gap: 8px; align-items: center; }
.item-proposta-topo input { font-weight: 600; }
.item-proposta-valores { display: grid; grid-template-columns: 90px 150px 200px 1fr; gap: 10px; align-items: end; }
.item-proposta-valores label { font-size: .78rem; }
.i-total { text-align: right; font-weight: 700; color: var(--azul); padding-bottom: 10px; font-variant-numeric: tabular-nums; }
.adicionar-item { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.adicionar-item select { flex: 1; min-width: 220px; }
.totais { margin-top: 14px; border-top: 2px solid var(--linha); padding-top: 10px; display: flex; flex-direction: column; gap: 4px; align-items: flex-end; }
.totais > div { display: flex; gap: 16px; align-items: baseline; }
.totais span { color: var(--tinta-2); font-size: .86rem; }
.totais strong { font-size: 1.15rem; color: var(--azul); font-variant-numeric: tabular-nums; }
.proposta-form > .cartao { margin-bottom: 18px; }
.barra-salvar { position: sticky; bottom: 0; background: linear-gradient(transparent, var(--fundo) 30%); padding: 14px 0 6px; z-index: 5; }
.contrato-mini { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--linha); border-radius: var(--raio-peq); margin-bottom: 10px; color: var(--tinta); }
.contrato-mini:hover { border-color: var(--verde); text-decoration: none; }
.contrato-mini span { display: flex; flex-direction: column; }
.contrato-mini small { color: var(--tinta-2); }
.texto-contrato { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: .84rem; line-height: 1.55; }
.previa-contrato { font-size: .9rem; }

/* ---------- Documento público (proposta e contrato) ---------- */
body.doc-pagina { background: #e9eef0; }
.doc-barra { position: sticky; top: 0; z-index: 10; display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 18px; background: rgba(7, 64, 86, .96); color: #fff; }
.doc-barra-txt { font-weight: 700; font-size: .9rem; }
.doc { max-width: 820px; margin: 24px auto 40px; background: #fff; box-shadow: 0 6px 30px rgba(7, 64, 86, .12); border-radius: 6px; overflow: hidden; padding: 0 0 26px; }
.doc-topo { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 22px 40px; color: #fff;
  background: linear-gradient(100deg, #fff 0%, #fff 26%, #8fd6d6 40%, #00a8a8 58%, #074056 100%); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.doc-logo { height: 62px; width: auto; }
.doc-id { display: flex; flex-direction: column; align-items: flex-end; text-align: right; }
.doc-tipo { font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; opacity: .9; }
.doc-id strong { font-size: 1.5rem; font-weight: 800; letter-spacing: -.01em; }
.doc-id small { font-size: .78rem; opacity: .92; }
.doc > section, .doc > p, .doc > .doc-alerta { margin-left: 40px; margin-right: 40px; }
.doc-para { margin-top: 26px; display: flex; flex-direction: column; border-left: 4px solid var(--verde); padding-left: 14px; }
.doc-rotulo { font-size: .72rem; text-transform: uppercase; letter-spacing: .12em; color: var(--tinta-2); font-weight: 700; }
.doc-para strong { font-size: 1.25rem; color: var(--azul); }
.doc-para span:last-child { color: var(--tinta-2); font-size: .9rem; }
.doc-alerta { margin-top: 16px; padding: 10px 14px; border-radius: var(--raio-peq); background: var(--s-ambar-c); color: var(--s-ambar); font-weight: 600; font-size: .9rem; }
.doc-intro { margin-top: 20px; font-size: 1rem; line-height: 1.65; }
.doc h2 { font-size: .8rem; text-transform: uppercase; letter-spacing: .12em; color: var(--verde-escuro); margin: 28px 0 10px; }
.doc-item { display: flex; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--linha); break-inside: avoid; }
.doc-item-txt strong { color: var(--azul); font-size: 1rem; }
.doc-item-txt p { margin: 4px 0 0; color: var(--tinta-2); font-size: .9rem; }
.doc-item-valor { display: flex; flex-direction: column; align-items: flex-end; text-align: right; white-space: nowrap; }
.doc-item-valor strong { font-size: 1.05rem; color: var(--tinta); font-variant-numeric: tabular-nums; }
.doc-item-valor small { color: var(--tinta-2); font-size: .76rem; }
.doc-totais { margin-top: 16px; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 12px; break-inside: avoid; }
.doc-totais > div { background: var(--degrade); color: #fff; border-radius: var(--raio-peq); padding: 12px 18px; min-width: 200px; display: flex; flex-direction: column; align-items: flex-end;
  -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.doc-totais span { font-size: .74rem; text-transform: uppercase; letter-spacing: .1em; opacity: .9; }
.doc-totais strong { font-size: 1.5rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.doc-totais strong small { font-size: .8rem; font-weight: 600; margin-left: 3px; }
.doc-bloco p { margin: 0; line-height: 1.65; }
.doc-assina { margin-top: 30px; display: flex; flex-direction: column; break-inside: avoid; }
.doc-assina p { margin: 0 0 10px; }
.doc-assina strong { color: var(--azul); }
.doc-assina span { color: var(--tinta-2); font-size: .9rem; }
.doc-rodape { margin: 30px 40px 0; padding-top: 14px; border-top: 3px solid var(--verde); display: flex; flex-direction: column; gap: 2px; font-size: .78rem; color: var(--tinta-2); text-align: center; }
.doc-contrato { margin-top: 10px; font-size: .93rem; line-height: 1.7; text-align: justify; }
.doc-contrato .doc-titulo { font-size: 1.15rem; text-align: center; margin: 22px 0 18px; color: var(--azul); }
.doc-contrato .doc-clausula { font-size: .82rem; margin: 20px 0 6px; color: var(--azul); text-align: left; }
.doc-contrato p { margin: 0 0 10px; }
.assinaturas { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 56px; break-inside: avoid; text-align: center; }
.assinaturas div { display: flex; flex-direction: column; align-items: center; }
.linha-assinatura { display: block; width: 100%; border-top: 1px solid var(--tinta); margin-bottom: 6px; }
.assinaturas strong { font-size: .88rem; }
.assinaturas small { font-size: .74rem; color: var(--tinta-2); }

@media (max-width: 1100px) {
  .menu-botao { display: flex; }
  .menu {
    position: fixed; top: 64px; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 2px;
    background: var(--azul); padding: 10px 14px 18px; box-shadow: 0 16px 30px rgba(0,0,0,.2);
    transform: translateY(-8px); opacity: 0; visibility: hidden; transition: opacity .15s, transform .15s, visibility .15s;
  }
  .menu.aberto { transform: none; opacity: 1; visibility: visible; }
  .menu a { padding: 12px 14px; font-size: .95rem; }
  .menu-sep { width: auto; height: 1px; margin: 6px 0; }
  .topo { overflow: visible; }
  .topo::after { display: none; }
  .agenda-layout { grid-template-columns: 1fr; }
  .dia-painel { position: static; max-height: none; }
  .relatorio-layout { grid-template-columns: 1fr; }
  .montador { position: static; max-height: none; }
  .duas-colunas.larga-esquerda { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  .duas-colunas { grid-template-columns: 1fr; }
  .acesso { grid-template-columns: 1fr; grid-template-rows: 230px 1fr; }
  .radar-anim svg { width: 110px; height: 110px; }
  .acesso-hub { height: 56px; margin-bottom: 10px; }
  .acesso-logo { height: 64px; }
  .acesso-marcas .marca-sep { height: 48px; margin-bottom: 11px; }
  .hub-ilustracao { width: 200px; }
  .hub-simbolo p { display: none; }
}

/* ---------- Celular ---------- */
@media (max-width: 680px) {
  body { font-size: 14.5px; }
  .conteudo { padding: 18px 14px 60px; }
  .topo-in { padding: 0 14px; min-height: 58px; gap: 10px; }
  .topo { --branco-ate: 200px; --verde-em: 310px; }
  .marca-logo { height: auto; }
  .marca-logo img { height: 37px; }
  .marca-hub img { height: 32px; margin-bottom: 5.5px; }
  .marca-sep { height: 28px; margin-bottom: 6px; }
  .marca-nome { font-size: 1.05rem; }
  .menu { top: 58px; }
  h1 { font-size: 1.35rem; }
  .titulo-pagina { align-items: stretch; }
  .titulo-pagina > .selos { align-self: flex-start; }
  .titulo-pagina > .grupo-botoes, .titulo-pagina > .btn, .titulo-pagina > .form-inline { width: 100%; }
  .titulo-pagina > .grupo-botoes > * { flex: 1; }
  .titulo-pagina > .grupo-botoes .btn, .titulo-pagina > .form-inline .btn, .titulo-pagina > .btn { width: 100%; }
  .indicadores { grid-template-columns: 1fr 1fr; }
  .para-enviar { padding: 14px; }
  .para-enviar-lista { grid-template-columns: 1fr; }
  .envio .grupo-botoes .form-inline:first-child, .envio .grupo-botoes .form-inline:first-child .btn { width: 100%; }
  .envio .btn-wa { min-height: 44px; font-size: .9rem; }
  .ind { border-left: 0; border-top: 1px solid var(--linha); padding: 14px; }
  .ind:nth-child(-n+2) { border-top: 0; }
  .ind:nth-child(even) { border-left: 1px solid var(--linha); }
  .ind-num { font-size: 1.55rem; }
  .calendario { padding: 12px; }
  .cal-topo h2 { min-width: 0; font-size: 1rem; flex: 1; }
  .cal-grade { gap: 3px; }
  .cal-sem { text-align: center; padding: 2px 0; font-size: .7rem; }
  .cal-dia { min-height: 52px; padding: 4px 2px; align-items: center; }
  .cal-dia.sel { padding: 3px 1px; }
  .cal-itens { display: none; }
  .cal-pontos { display: flex; flex-wrap: wrap; justify-content: center; gap: 2px; }
  .cal-pontos .ponto { margin: 0; width: 7px; height: 7px; }
  .busca { flex-direction: column; }
  .tabela thead { display: none; }
  .tabela, .tabela tbody, .tabela tr, .tabela td { display: block; width: 100%; }
  .tabela tr { padding: 12px 14px; border-bottom: 1px solid var(--linha); }
  .tabela tbody tr:last-child { border-bottom: 0; }
  .tabela td { border: 0 !important; padding: 4px 0; text-align: right; white-space: normal !important; overflow: hidden; }
  .tabela td::before { content: attr(data-rot); float: left; margin-right: 12px; color: var(--tinta-2); font-size: .78rem; text-align: left; padding-top: 2px; }
  .tabela td .sub { display: block; }
  .celula-acoes { padding-top: 10px !important; }
  .celula-acoes::before { content: none !important; }
  .celula-acoes .grupo-botoes { justify-content: flex-start; width: 100%; }
  .dados { grid-template-columns: 1fr; gap: 0; }
  .dados dt { margin-top: 8px; }
  .grade-campos, .linha-campos, .variaveis { grid-template-columns: 1fr; }
  .span-2 { grid-column: auto; }
  .linha-tempo li { grid-template-columns: 1fr; gap: 0; }
  .regras { grid-template-columns: 1fr; }
  .regra-remover { justify-self: start; margin-bottom: 8px; }
  .copiar { flex-direction: column; }
  .flutuante { position: static; width: 100%; margin-top: 8px; }
  .salvar-relatorio { width: 100%; }
  .acesso-caixa { padding: 32px 22px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* ---------- Impressão ---------- */
@media print {
  body { background: #fff; font-size: 10.5pt; }
  .topo, .so-tela, .aviso { display: none !important; }
  .conteudo { padding: 0; max-width: none; }
  .relatorio-layout { display: block; }
  .cartao { box-shadow: none; border: 0; padding: 0; }
  .cabecalho-impressao { display: flex; gap: 14px; align-items: center; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 3px solid var(--verde); }
  .tabela th { background: #eef4f5 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .tabela td, .tabela th { padding: 5px 7px; }
  .tabela-relatorio td { white-space: normal; }
  @page { margin: 12mm; size: landscape; }
}

@media (max-width: 680px) {
  .lista-lembretes { grid-template-columns: 1fr; }
  .indicadores.ind-3 { grid-template-columns: 1fr 1fr 1fr; }
  .indicadores.ind-3 .ind { border-top: 0; border-left: 1px solid var(--linha); padding: 12px 10px; }
  .indicadores.ind-3 .ind:first-child { border-left: 0; }
  .indicadores.ind-3 .ind-num { font-size: 1.3rem; }
  .indicadores.ind-3 .ind-rot { font-size: .74rem; }
  .item-proposta-valores { grid-template-columns: 1fr 1fr; }
  .item-proposta-valores label:nth-child(3) { grid-column: 1 / -1; }
  .i-total { grid-column: 1 / -1; padding-bottom: 0; }
  .doc { margin: 0; border-radius: 0; box-shadow: none; }
  .doc-topo { padding: 16px 18px; background: linear-gradient(100deg, #fff 0%, #fff 30%, #00a8a8 62%, #074056 100%); }
  .doc-logo { height: 44px; }
  .doc-id strong { font-size: 1.15rem; }
  .doc > section, .doc > p, .doc > .doc-alerta { margin-left: 18px; margin-right: 18px; }
  .doc-rodape { margin: 26px 18px 0; }
  .doc-item { flex-direction: column; gap: 6px; }
  .doc-item-valor { align-items: flex-start; text-align: left; flex-direction: row; gap: 8px; align-items: baseline; flex-wrap: wrap; }
  .doc-totais > div { min-width: 0; flex: 1; }
  .doc-barra { padding: 8px 12px; }
  .doc-barra-txt { display: none; }
  .doc-barra .grupo-botoes { width: 100%; flex-wrap: nowrap; }
  .doc-barra .grupo-botoes > * { flex: 1; justify-content: center; }
  .doc-totais strong { font-size: 1.2rem; }
  .doc-totais > div { padding: 10px 12px; }
  .doc-contrato { text-align: left; }
  .assinaturas { grid-template-columns: 1fr; gap: 50px; }
}

@page doc { size: A4 portrait; margin: 12mm 0; }
@media print {
  body.doc-pagina { background: #fff; font-size: 10.5pt; }
  .doc { page: doc; max-width: none; margin: 0; box-shadow: none; border-radius: 0; padding-bottom: 0; }
  .doc-topo { padding: 16px 14mm; }
  .doc > section, .doc > p, .doc > .doc-alerta { margin-left: 14mm; margin-right: 14mm; }
  .doc-rodape { margin: 18px 14mm 0; break-inside: avoid; }
  .doc-para { margin-top: 18px; }
  .doc-intro { margin-top: 14px; line-height: 1.55; }
  .doc h2 { margin: 18px 0 6px; }
  .doc-item { padding: 9px 0; }
  .doc-totais { margin-top: 12px; }
  .doc-assina { margin-top: 18px; }
  .doc-contrato { line-height: 1.6; }
}

/* =========================================================
   Menu lateral (SL Hub)
   ========================================================= */
body.logado { --lat: 252px; }
html.recolhido body.logado { --lat: 76px; }
body.logado .area { margin-left: var(--lat); min-height: 100vh; transition: margin-left .2s; }
.faixa-topo { height: 5px; background: var(--degrade); position: sticky; top: 0; z-index: 20; }
.lateral {
  position: fixed; inset: 0 auto 0 0; width: var(--lat); z-index: 60; background: #fff;
  border-right: 1px solid var(--linha); display: flex; flex-direction: column; padding: 14px 12px 12px;
  transition: width .2s; overflow: hidden;
}
.lat-marca { display: flex; align-items: flex-end; gap: 10px; padding: 4px 8px 14px; border-bottom: 1px solid var(--linha); margin-bottom: 6px; min-height: 64px; }
.lat-marca:hover { text-decoration: none; }
.lat-hub { height: 34px; width: auto; margin-bottom: 6px; }
.lat-marca .marca-sep { height: 29px; margin-bottom: 7px; }
.lat-sl { height: 39px; width: auto; }
.lat-simbolo { display: none; }
.lat-nav { flex: 1; overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; margin: 0 -4px; padding: 0 4px; }
.lat-grupo { font-size: .66rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-2); padding: 14px 10px 5px; white-space: nowrap; }
.lat-item {
  display: flex; align-items: center; gap: 11px; width: 100%; padding: 9px 10px; border-radius: 9px; margin: 1px 0;
  color: var(--tinta); font: inherit; font-weight: 600; font-size: .9rem; background: none; border: 0; cursor: pointer; text-align: left; white-space: nowrap;
}
.lat-item .ic { color: var(--verde-escuro); flex: none; }
.lat-item:hover { background: #eef6f7; text-decoration: none; }
.lat-item.ativo { background: var(--degrade-botao); color: #fff; }
.lat-item.ativo .ic { color: #fff; }
.lat-item .contador { margin-left: auto; background: var(--s-azul); color: #fff; }
.lat-item.ativo .contador { background: #fff; color: var(--azul); }
.lat-rodape { border-top: 1px solid var(--linha); padding-top: 8px; margin-top: 8px; }
.lat-usuario { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 9px; color: var(--tinta); }
.lat-usuario:hover { background: #eef6f7; text-decoration: none; }
.lat-usuario.ativo { background: var(--s-teal-c); }
.lat-usuario .avatar { background: var(--degrade); color: #fff; flex: none; }
.lat-usuario strong { display: block; font-size: .88rem; line-height: 1.2; }
.lat-usuario small { display: block; color: var(--tinta-2); font-size: .74rem; }
.lat-recolher { color: var(--tinta-2); }
.lat-recolher .ic { color: var(--tinta-2); transition: transform .2s; }

/* recolhido: só os ícones */
html.recolhido .lat-txt, html.recolhido .lat-grupo, html.recolhido .lat-item .contador { display: none; }
html.recolhido .lat-grupo + .lat-item { margin-top: 10px; }
html.recolhido .lat-item, html.recolhido .lat-usuario { justify-content: center; padding: 10px 0; }
html.recolhido .lat-marca { justify-content: center; padding: 4px 0 14px; align-items: center; }
html.recolhido .lat-marca > img, html.recolhido .lat-marca > .marca-sep { display: none; }
html.recolhido .lat-simbolo { display: block; }
html.recolhido .lat-simbolo img { display: block; }
html.recolhido .lat-recolher .ic { transform: rotate(180deg); }
html.recolhido .lat-item { position: relative; }
html.recolhido .lat-item:has(.contador)::after { content: ""; position: absolute; top: 7px; right: 14px; width: 8px; height: 8px; border-radius: 50%; background: var(--s-azul); }

body.logado .conteudo { max-width: 1240px; }
.topo-cel, .barra-baixo, .lat-fundo { display: none; }

@media (max-width: 860px) {
  body.logado { --lat: 270px; }
  html.recolhido body.logado { --lat: 270px; }
  body.logado .area { margin-left: 0; padding-bottom: 72px; }
  .faixa-topo { display: none; }
  .topo-cel {
    display: flex; align-items: center; position: sticky; top: 0; z-index: 40; min-height: 60px; padding: 0 16px;
    background: linear-gradient(90deg, #fff 0, #fff 62%, #00a8a8 88%, #074056 100%);
    box-shadow: 0 1px 0 rgba(7,64,86,.08), 0 2px 10px rgba(7,64,86,.08);
  }
  .topo-cel .lat-marca { border: 0; margin: 0; padding: 8px 0 6px; min-height: 0; }
  .topo-cel .lat-hub { height: 30px; margin-bottom: 5px; }
  .topo-cel .marca-sep { height: 26px; margin-bottom: 6px; }
  .topo-cel .lat-sl { height: 35px; }
  .lateral { transform: translateX(-102%); transition: transform .22s; box-shadow: 0 0 40px rgba(7,64,86,.25); }
  .lateral.aberto { transform: none; }
  html.recolhido .lat-txt, html.recolhido .lat-grupo, html.recolhido .lat-item .contador { display: revert; }
  html.recolhido .lat-marca > img, html.recolhido .lat-marca > .marca-sep { display: revert; }
  html.recolhido .lat-simbolo { display: none; }
  html.recolhido .lat-item, html.recolhido .lat-usuario { justify-content: flex-start; padding: 9px 10px; }
  .lat-recolher { display: none; }
  .lat-fundo { display: block; position: fixed; inset: 0; background: rgba(7,40,56,.45); z-index: 55; }
  .lat-fundo[hidden] { display: none; }
  .barra-baixo {
    display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
    background: #fff; border-top: 1px solid var(--linha); padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
    box-shadow: 0 -4px 18px rgba(7,64,86,.08);
  }
  .barra-baixo a, .barra-baixo button {
    display: flex; flex-direction: column; align-items: center; gap: 3px; position: relative; padding: 4px 0;
    font: inherit; font-size: .68rem; font-weight: 600; color: var(--tinta-2); background: none; border: 0; cursor: pointer;
  }
  .barra-baixo a:hover { text-decoration: none; }
  .barra-baixo .ic { width: 23px; height: 23px; }
  .barra-baixo .ativo { color: var(--azul); }
  .barra-baixo .ativo::before { content: ""; position: absolute; top: -7px; width: 36px; height: 3px; border-radius: 0 0 3px 3px; background: var(--degrade); }
  .barra-baixo .bolinha { position: absolute; top: 0; left: calc(50% + 6px); background: var(--s-verm); color: #fff; font-size: .6rem; min-width: 16px; height: 16px; border-radius: 9px; display: grid; place-items: center; padding: 0 4px; }
}
@media print {
  .lateral, .topo-cel, .barra-baixo, .faixa-topo { display: none !important; }
  body.logado .area { margin-left: 0 !important; }
}
.acesso-link { margin: 16px 0 0; text-align: center; font-weight: 600; font-size: .9rem; }