:root{
  --azul:#003C52; --dourado:#A68B4D; --off:#F2EFE6;
  --bege:#F7F5EF; --texto:#5A5A5A; --claro:#8A8A8A;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Calibri,Carlito,"Segoe UI",sans-serif;background:var(--bege);color:var(--texto);font-size:16px}
.topo{background:var(--azul);color:#fff;padding:14px 18px;display:flex;align-items:center;justify-content:space-between}
.topo h1{font-size:18px;font-weight:700;letter-spacing:.5px}
.topo a{color:#cfe0e8;text-decoration:none;font-size:14px}
.faixa{height:4px;background:var(--dourado)}
.corpo{max-width:var(--largura);margin:0 auto;padding:18px}
.cartao{background:#fff;border-radius:8px;padding:18px;margin-bottom:14px;box-shadow:0 1px 3px rgba(0,60,82,.10)}
.entrada{max-width:380px;margin:12vh auto;background:#fff;border-radius:8px;padding:26px;box-shadow:0 2px 10px rgba(0,60,82,.12)}
.entrada h1{color:var(--azul);font-size:22px;margin-bottom:4px}
.entrada p{color:var(--claro);font-size:14px;margin-bottom:18px}
label{display:block;font-size:13px;color:var(--azul);font-weight:700;margin-bottom:6px}
input[type=password],input[type=text],input[type=number],select,textarea{
  width:100%;padding:12px;border:1px solid #d8d8d8;border-radius:8px;font-size:16px;font-family:inherit;background:#fff}
button,.botao{
  width:100%;padding:13px;border:0;border-radius:8px;background:var(--azul);color:#fff;
  font-size:16px;font-weight:700;font-family:inherit;cursor:pointer;margin-top:14px;display:block;text-align:center;text-decoration:none}
button:hover{background:#00546f}
.erro{background:#fdecea;color:#a3271c;padding:10px 12px;border-radius:8px;font-size:14px;margin-bottom:14px}
.ok{background:#eaf5ec;color:#256b2e;padding:10px 12px;border-radius:8px;font-size:14px;margin-bottom:14px}
.vazio{text-align:center;color:var(--texto);padding:40px 10px}
.rodape{text-align:center;color:var(--claro);font-size:12px;padding:18px}

/* Telas de tarefa, acrescentado em 09/09/2026 */
.menu { display: flex; gap: 2px; max-width: var(--largura); margin: 0 auto; padding: 10px 18px 0; }
.menu a { flex: 1; text-align: center; padding: 10px 6px; background: #FFFFFF; color: #003C52; text-decoration: none; font-weight: 600; font-size: 14px; border-radius: 6px 6px 0 0; border: 1px solid #E3DFD3; border-bottom: none; }
.menu a.ativo { background: #003C52; color: #FFFFFF; border-color: #003C52; }
.cartao h2 { margin: 0 0 12px; font-size: 16px; color: #003C52; }
.dupla { display: flex; gap: 12px; }
.dupla > div { flex: 1; }
.marca { display: flex; align-items: center; gap: 8px; font-weight: 600; margin: 14px 0; }
.marca input { width: auto; margin: 0; }
.filtro { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.filtro select, .filtro input { flex: 0 0 auto; width: max-content; min-width: max-content; max-width: 100%; margin: 0; white-space: nowrap; text-overflow: clip; }
.filtro select { padding-right: 34px; }
.filtro button { width: auto; padding: 10px 18px; margin: 0; }
.item { display: block; padding: 12px 0; border-bottom: 1px solid #EFECE2; text-decoration: none; color: #333333; }
.item:last-child { border-bottom: none; }
.item-titulo { display: block; font-weight: 600; color: #003C52; margin: 4px 0 2px; }
.item-info { display: block; font-size: 13px; color: #8A8A8A; }
[hidden] { display: none !important; }
.etiqueta { display: inline-block; padding: 3px 10px; border-radius: 8px; font-size: 11px; font-weight: 700; letter-spacing: 0.5px; color: #FFFFFF; }
.s-afazer { background: #8A8A8A; }
.s-iniciada { background: #003C52; }
.s-parada { background: #A68B4D; }
.s-concluida { background: #1E7A5A; }
.s-multa { background: #B03A2E; }
.atraso { display: inline-block; margin-top: 6px; font-size: 12px; font-weight: 700; color: #B03A2E; }
.anotacao { font-size: 14px; color: #5A5A5A; margin: 10px 0 0; }
.hist { font-size: 14px; padding: 10px 0; border-bottom: 1px solid #EFECE2; margin: 0; }
.hist:last-child { border-bottom: none; }
.tabela { width: 100%; border-collapse: collapse; font-size: 14px; }
.tabela th { text-align: left; padding: 8px 6px; border-bottom: 2px solid #003C52; color: #003C52; font-size: 12px; text-transform: uppercase; }
.tabela td { padding: 8px 6px; border-bottom: 1px solid #EFECE2; }
.ok a { color: #1E7A5A; }
.numeros { display: flex; gap: 10px; max-width: var(--largura); margin: 0 auto 16px; }
.numero { flex: 1; text-align: center; padding: 16px 8px; border-radius: 8px; text-decoration: none; color: #FFFFFF; }
.numero strong { display: block; font-size: 28px; line-height: 1; }
.numero span { display: block; font-size: 12px; margin-top: 6px; letter-spacing: 0.3px; }
.n-atraso { background: #B03A2E; }
.n-hoje { background: #003C52; }
.n-semana { background: #A68B4D; }
a.botao { display: block; text-align: center; text-decoration: none; max-width: var(--largura); margin: 18px auto 0; }
input[type=date], input[type=month], input[type=email] { width: 100%; box-sizing: border-box; padding: 12px; margin: 6px 0 14px; border: 1px solid #D9D4C6; border-radius: 6px; font-size: 15px; font-family: inherit; background: #FFFFFF; }
@media (max-width: 560px) { .dupla { flex-direction: column; gap: 0; } .numeros { gap: 6px; } .numero strong { font-size: 22px; } .menu a { font-size: 13px; padding: 9px 4px; } }
.excluir { max-width: var(--largura); margin: 0 auto; }
.perigo { background: #FFFFFF; color: #B03A2E; border: 1px solid #E0BDB8; }
.perigo:hover { background: #B03A2E; color: #FFFFFF; }
/* Selo da marca e autoria, 09/09/2026 */
.selo { display: block; width: 54px; height: 46px; margin: 0 auto 8px; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADgAAAAwCAYAAABE1blzAAAJ80lEQVR42tVaTWxU1xX+7n33eX7ewBgqXDRKiVNZquXxwsqAmM1rkkqlL+BIbhSz6ALoposSkSLRhbMAnM0sQEJCuIssItKlB0WWYoIVqfnpsJjQOPXCRkaqiutGloFizcSe//vu7eK9++bXxvYY3F7JmvGb93PPPd/5znfOfQRbGpeo+kZGygAAmehwj4wK7OhwnzV8n3iHlpcJDh6UtWeRnh7pzGGnn/9/MoizUqOCRq0IDemTQtP7a0+gdmW27gohFhzXyX+5nw9RLn+PDl3gaeYeANh+5OR8OrvVybDueAQAhNHpPJtW4gCAjo6XqjMmr7ifL7sndTfdiFc+4NNTExge1phniB9dQtP7aaU0CSG+qp4tFxsuX/BsLeKx802HzGVyxOg0AEDOTWW3s9q2Hzl31Q1nLfU0AFDILlHEY+pHF6T8K4BuKKAK2zVAOyV03yAAUM4PKUizpqcI+wM+PTWznQlKINsOnJTXG+8jgKXaTwB18yO98TDZHxlv5RTW8kmmyeiK0SX69jzC8jJBKsUdYhmhuxvQVZKD+QUFALpidNGQPtlyQgcPSqYmK4p4DJ/7QyrFBS4to+8+QSrFWcwaAtVO8UTi7d2ljJqFPThMkEza9MiJG4o3aCl/EoS+VschTQj14mpUkJ4eB+lMvxjcawyxmDXgUPewtqt2miZDMmmzw8eveXFXKlzg01MTHvm0MpDalVlpZ3LqJjKRECxmDQhN718rcA6qXdx13h8e1hSqRIf/bNW4O9fJyAj12B0Akn2SNqYAojlMWLVau0jLxTFqV2aF7hskvfEwkkl712IwmbRp1IoIX3AcAGi5OKaMk4mEaGT6ZojOTS0BlyhSKU5642Gh+wbxn5Ur4PxmKMCYZuw77cHkhUPTJZagdiMUYIyWi2P828/OwzSZvHuXtrqk/qDrXhr95iAAaMa+09SuzOJHnV2AXFwrcA7Gzigi2i1oBvcaQ/kfchP828/Oq+OehJPyYS0ptbRa9O155JCLawzTPwLTLwKA0PT+XSGbZJ8kvfGw8AXH1wqc26tPf+sc3zhcGj34UF3EYtYQAODRk0H+zaev8m8+fZWWChdCAcZA6OkX7j2MCi20/zIAIJvvlvPp7HoLXM0EjYm+XP7egagV8TxmdIJGrYjo2/MI/1x1YNrhP0uj1hWRTC7VUXdDkt0RMhoe1jxi6fCfpaXCBT43teSmCl7r4aoNOjZUMtRP3qn9zqfvXKewIghqpzzxHdRuCNM8idQvBDAqnldMkp4eKQHQkD4JuzLLp+9ch2myzT7Pq7Vo1IpUWXTrg8XePAdKX/fISoqPeTA325bhrvdYzBoSvuA4svluj+XXkYs0akWknfGqmfpEn8vUBiRx/lrpQUkU/lnMGmBH3/oOjJ2BEF9BiK+gaa8JX/AeXTG62vWeUlK0XBwTCpobaGGay0ArwmiCqLQzOdtfd3u5vh4cBZKwSW88DKZ/JDS9ny4tdfOF9JKr7j8m+yNPqB9dNRXAlr0nEwmP7ERBXHE9+kxEqLKrzoNyPp3ddJHqEopm7DsdDAUGaLk4xhfSS2RkhNKoFcGv31hFNt9dy2bbHlQ7Bc5vbjZ0+JGfPKq1Y3tqRCVVVV276UXevUvlXGoJc1OQjZ4zTbZ5Zr1EkRy1Vb4VRXnLlWLPvrbh/u3JrQbl7iiNN8/VGs6n71yvVT6bqinNLyhSEAD5OYT9ZzE3tYS+PdsSFdszcHmZ1PVllEGmyZCXi6IjcFWpfHWc5UO/B+QiTyQmvHPXY9hUitOoFQEhr/DA2p82o1g2p2S2ClEpPl4rcC46/GdJbzyMVIrz6akJWilNKmipqlv4AleFLzjOjpz4hEatiGdckxpxqnan/yK+RirF25GE2zMwmbTJyAjl01MzSr5p4QNfspg1wGLWQGOni/rhpQuh+wYRDi6ww8eveaWXrKadqqqq/FQUca8d723fQAAykRCOkXeu5zM/vA0Awhe8B6Z/pOAp9ufWZdFgOPSeuyhDIMQhH1dzeu3DbYqOlkqmjV4YUTmT9MbDROs0vIlJSUCIZDFrQPiC91pdHQowlv8hN1HbzSO98bBWhKHyaltZZgfUonRWXhI5n846xkkC02Tk/fefuYBrBc6F7hsUvuA9dvj4NRq1InI+nRVG546UYztgoIqRWuVD5EYaNBRg7MyA1NVfKMCYgi3CwQUWe/MczWW8WK9rF+6KgVsc7/ysQm490OXNGVJR/ytvOrEcuIofH5hkMWvI6bNsvw9La5WGCu7nOUIBxo71VOd7c4ZUbj3Qm3Sv0PT+urTSroHs35WuF+G9tQLnn/+D4sMTJaLgqTzXsjpXaWWTbRIatSIOrBuUjNrReRHDgSbVj/UIHOspkd/d9m1oJK2UJkURj2nUiuD+KoRpPl6va0BzGXCnwyaayqWmnuhzgqhjJK/cnNGQ+CX0D0+UyG9uNTuG2pVZbytsk0MYnSBPMobawPEMJFqnQWklLoBPNqqYd4pkbs4QiDXoD55IPHjSzHW0XByz11Yuy/l0lkatCA3QP0LKh57udaTi13Yu82VteURpJW7b+Etrsd2hC9UXFXNYel4xCEA/MyC9zpBDMrwKx7z9LnfFgkcwUj4UPiXi8ycBckj4guMa02ft3vgbcv5Xq8opROts9qCjF8khry8693xjUEHVMdg1rpQ/6cHRrTbE3NFlYFQgat2CD1epXZlV57AjJ14P7jWG8rzzDY5R57qOjpdQlLubB5VhilhouTiGbL6bT09NeIl9a82qhTrxqDaQ2i5425VRldJk3Y6y24fZkEQ0vV8V1UL3DeYzq3+o25GujVHHgzUyqOHHtmW494pJC+NKhQv8b7ff5tNTM15u26Asqi25QMgr0LTX1HcvTk2TgZCX5QF99zyo2JHPp7NOJXKZIDn6zHpP7UBTuzLLv/3sPACww8evBcOh9/JYgwDO0xWjC8H1WxbdTT2WtofDajyYm2V5cgGQi/UkQjgAueX6pTcelvPprCiIKwjjvbp5NxTbDMP3CZLP2W2pFOfA9dpu9XY73kLT++UBPYcDJqNF7YZz0HntRcGYrhheP/bFQXRLbcN6FNCoFaFB7QbcfRFa2TuuvOWQjNu52xyLXqKkpyylCnzVQWtsOAHujs4mFc+WPXaJeu+p3V+FyNvv0txT2H54klLM3V5SqCA9PRKf/71baHq/VoTBvUTvGUAOOfgdFTKB/4ExKlTo1LwI5Hio8YWjZNKWABCzNu6LCk3vZ0ff+s7FdTV51r6XVj24iHKFYjWX9trm7fRQTJPVlWx7jLiSjkphNaWyBnJR78vU7k14zVdRlLcoCo2ZbLGValDvjQmhP4bRWYf57Q5lnAdBgTSKKgfKBY/pZc2cvGAhhyAEKOcA5CI/oOcw7/zyX5q9Ijegf2FWAAAAAElFTkSuQmCC); background-size: contain; background-repeat: no-repeat; background-position: center; }
.topo .selo { display: inline-block; width: 34px; height: 30px; margin: 0 10px 0 0; vertical-align: middle; background-color: #FFFFFF; border-radius: 6px; background-size: 82% auto; background-position: center; }
.topo h1 { display: inline-block; vertical-align: middle; }
.autoria { max-width: var(--largura); margin: 0 auto; padding: 14px 18px 26px; text-align: center; font-size: 11px; line-height: 1.7; color: #8A8A8A; }
.autoria strong { color: #003C52; }
.entrada .selo { width: 88px; height: 76px; margin-bottom: 14px; background-size: 88% auto; background-position: center; }
.topo { justify-content: flex-start; }
.topo a { margin-left: auto; }
.autoria .selo { width: 78px; height: 67px; margin-bottom: 8px; background-size: 92% auto; background-position: center; }
.acoes { white-space: nowrap; text-align: right; }
.cancelar { margin-top: 12px; text-align: center; font-size: 13px; }
.cancelar a { color: #003C52; text-decoration: underline; }
.tabela td.acoes, .tabela th:last-child { text-align: right; }
.acoes form { display: inline-block; margin: 0 0 0 28px; }
.acoes button { width: auto; margin: 0; padding: 7px 14px; font-size: 13px; }
a.botao-pequeno, button.botao-pequeno { display: inline-block; width: auto; margin: 0; padding: 7px 14px; font-size: 13px; font-weight: 600; text-decoration: none; color: #FFFFFF; background: #003C52; border-radius: 6px; cursor: pointer; }
button.botao-pequeno { border: 0; font-family: inherit; }
/* Painel e area do cliente, 09/09/2026 */
.cartao { overflow-x: auto; scrollbar-width: thin; scrollbar-color: #A68B4D transparent; }
.cartao::-webkit-scrollbar { height: 6px; }
.cartao::-webkit-scrollbar-track { background: transparent; }
.cartao::-webkit-scrollbar-thumb { background: #A68B4D; border-radius: 3px; }
.cartao::-webkit-scrollbar-thumb:hover { background: #003C52; }
.barra-linha { display: flex; align-items: center; gap: 10px; margin: 8px 0; }
.barra-nome { flex: 0 0 42%; font-size: 13px; color: #003C52; }
.barra-fundo { flex: 1; height: 14px; background: #EFECE2; border-radius: 8px; overflow: hidden; }
.barra-cheia { display: block; height: 100%; border-radius: 8px; }
.barra-num { width: 36px; text-align: right; font-weight: 700; color: #003C52; }
.medidor { margin: 4px 0 16px; }
.medidor-fundo { height: 22px; background: #EFECE2; border-radius: 8px; overflow: hidden; }
.medidor-cheio { height: 100%; background: #1E7A5A; }
.medidor-num { text-align: right; font-weight: 700; color: #003C52; margin-top: 6px; }
.perigo-texto { color: #B03A2E; font-weight: 700; margin-top: 8px; }

/* Tabela larga sem cortar coluna, 09/09/2026 */
.tabela { min-width: 720px; table-layout: auto; }
.tabela td, .tabela th { vertical-align: middle; }
.tabela td, .tabela th { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.tabela td.acoes, .tabela th:last-child { width: 1%; white-space: nowrap; padding-left: 14px; }

.tabela td.num { white-space: nowrap; font-variant-numeric: tabular-nums; }
.tabela td.uma-linha { white-space: nowrap; }
.tabela td.apelido { white-space: nowrap; font-weight: 600; color: #003C52; }
/* Botao Voltar, 09/09/2026 */
.voltar { margin: 0 0 14px; }
.voltar-fim { margin: 16px 0 4px; text-align: center; }
a.botao-voltar { display: inline-block; padding: 11px 22px; font-size: 15px; font-weight: 700; text-decoration: none; color: #003C52; background: #FFFFFF; border: 1px solid #003C52; border-radius: 8px; }
a.botao-voltar:hover { background: #003C52; color: #FFFFFF; }
/* Termo de uso, 09/09/2026 */
.termo { max-height: 46vh; overflow-y: auto; padding: 4px 10px 4px 0; font-size: 15px; line-height: 1.55; color: #3F3F3F; border-left: 3px solid #A68B4D; padding-left: 14px; }
.termo br + br { line-height: 2; }
textarea { min-height: 120px; }
/* Entrada com o AGsBinho e o AR, 09/09/2026 */
.agsbinho-entrada { display: block; width: 180px; max-width: 70%; margin: 0 auto 10px; }
.entrada { padding-top: 20px; }
/* Entregas, 09/09/2026 */
.retirar { display: flex; gap: 6px; align-items: center; margin-top: 6px; flex-wrap: wrap; }
.retirar input[type=text] { width: 150px; padding: 7px; font-size: 13px; margin: 0; }
.retirar select { width: auto; padding: 7px; font-size: 13px; margin: 0; }
.retirar button { width: auto; padding: 7px 12px; font-size: 13px; margin: 0; }
input[type=file] { width: 100%; padding: 10px; border: 1px dashed #A68B4D; border-radius: 8px; background: #FFFFFF; font-size: 14px; }
button.perigo, .perigo { background: #FFFFFF; color: #B03A2E; border: 1px solid #B03A2E; }
button.perigo:hover { background: #B03A2E; color: #FFFFFF; }
/* Chave de envio de e-mail, 09/09/2026 */
.chave { margin: 0 0 4px; }
.chave button { width: auto; margin: 0; padding: 6px 12px; font-size: 12px; font-weight: 700; border-radius: 8px; }
.chave button.ligado { background: #1E7A5A; color: #FFFFFF; }
.chave button.desligado { background: #EFECE2; color: #8A8A8A; }
.chave button.convite { background: #FFFFFF; color: #003C52; border: 1px solid #003C52; border-radius: 6px; font-weight: 600; }
/* Cards do Como usar, 10/09/2026 */
.card-ajuda { display: flex; align-items: center; gap: 16px; }
.card-figura { width: 110px; flex: 0 0 110px; }
.card-texto { flex: 1; }
.card-numero { display: inline-block; background: #A68B4D; color: #FFFFFF; font-weight: 700; font-size: 12px; padding: 2px 10px; border-radius: 8px; margin-bottom: 6px; }
.card-ajuda h2 { margin: 4px 0 6px; }
@media (max-width: 520px) { .card-ajuda { flex-direction: column; text-align: center; } .card-figura { width: 130px; flex: none; } }

.selo-adicional{display:inline-block;background:#A68B4D;color:#fff;font-size:11px;font-weight:700;letter-spacing:.3px;padding:3px 8px;border-radius:8px;vertical-align:middle;line-height:1.3}
.selo-incluido{display:inline-block;background:#E6EDF0;color:#003C52;font-size:11px;font-weight:700;letter-spacing:.3px;padding:3px 8px;border-radius:8px;vertical-align:middle;line-height:1.3;white-space:nowrap}
.selo-bussola{display:inline-block;background:#003C52;color:#fff;font-size:11px;font-weight:700;letter-spacing:.3px;padding:3px 8px;border-radius:8px;vertical-align:middle;line-height:1.3}

.campo-senha { position: relative; display: block; }
.campo-senha input { padding-right: 46px; }
.olho { position: absolute; top: 50%; right: 6px; transform: translateY(-50%); width: 34px; height: 34px; margin: 0; padding: 0; display: flex; align-items: center; justify-content: center; background: transparent; border: 0; border-radius: 6px; color: #8A8A8A; cursor: pointer; }
.olho:hover { color: #003C52; background: #F2EFE6; }
.olho.aberto { color: #A68B4D; }

.chave button.bloqueado { background: #B03A2E; color: #FFFFFF; border-radius: 8px; }

.erro a { color: #7A1D14; font-weight: 700; }
.erro strong { color: #7A1D14; }

.passos { margin: 6px 0 0 20px; padding: 0; }
.passos li { font-size: 15px; line-height: 1.6; color: #3F3F3F; margin-bottom: 10px; padding-left: 4px; }
.passos li::marker { color: #A68B4D; font-weight: 700; }
.passos strong { color: #003C52; }
.marca-aparelho { display: inline-block; background: #FDEBCD; color: #003C52; padding: 4px 12px; border-radius: 8px; font-size: 14px; }
.icone-inline { display: inline-flex; vertical-align: middle; color: #003C52; }

/* Solicitações do cliente */
.campo { margin-bottom: 14px; }
.campo > label { display: block; }
.campo .dica { margin-top: 6px; }
button.botao-secundario { background: #A68B4D; }
.item .item-info + .item-info { margin-top: 4px; }

/* Padrao AGsB: palavra nao se parte nem cai para outra linha */
.tabela td, .tabela th, .etiqueta, .item-titulo, .barra-nome, .numero span, .selo-incluido, .selo-bussola, .selo-adicional { white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.item-titulo { overflow: hidden; text-overflow: ellipsis; }
.cartao { overflow-x: auto; }

/* Botoes de periodo, com respiro e sem corte */
.periodo { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; margin: 22px 0 2px; clear: both; }
.periodo a { margin: 0; }

/* Marcar empresas dentro da meta */
.lista-marcar { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 14px; max-height: 320px; overflow-y: auto; padding: 10px 4px; margin: 6px 0 14px; border: 1px solid #E4E0D4; border-radius: 8px; background: #FCFBF7; }
.lista-marcar .marca { margin: 0; font-weight: 500; font-size: 14px; white-space: nowrap; }

/* Painel: seis meses de entrega */
.colunas { display: flex; align-items: flex-end; gap: 14px; height: 190px; margin: 10px 0 6px; padding: 0 2px; }
.coluna { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; }
.coluna-pilha { width: 100%; max-width: 56px; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; border-radius: 6px 6px 0 0; overflow: hidden; background: #F2EFE6; }
.coluna-parte { width: 100%; }
.c-prazo { background: #003C52; }
.c-multa { background: #B03A2E; }
.c-aberto { background: #C9C2B0; }
.coluna-nome { margin-top: 6px; font-size: 12px; color: #4A4A4A; white-space: nowrap; }
.coluna-num { font-size: 13px; font-weight: 700; color: #003C52; white-space: nowrap; }
.legenda { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; font-size: 12px; color: #4A4A4A; margin: 6px 0 0; white-space: nowrap; }
.legenda .ponto { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }

/* Troca de empresa no acesso do cliente */
.troca-empresa { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 16px; background: #F2EFE6; border-bottom: 1px solid #E0DACB; }
.troca-empresa .troca-rotulo { font-size: 11px; font-weight: 700; letter-spacing: 0.06em; color: #003C52; white-space: nowrap; }
.troca-empresa a { display: inline-block; padding: 5px 12px; border-radius: 8px; border: 1px solid #C9C2B0; background: #FFFFFF; color: #003C52; font-size: 13px; text-decoration: none; white-space: nowrap; }
.troca-empresa a.ativa { background: #003C52; border-color: #003C52; color: #FFFFFF; font-weight: 700; }

/* Relatórios */
.rolagem { overflow-x: auto; }
.botao-pequeno.ativo { background: #003C52; color: #FFFFFF; border-color: #003C52; }
@media print {
  .topo, .faixa, .menu, .filtro, .periodo, .nao-imprime, .voltar, .rodape-acao { display: none !important; }
  .cartao { box-shadow: none; border: 0; padding: 0; }
  .corpo { padding: 0; }
  .tabela { font-size: 10px; }
}

/* AGsBinho, balão de ajuda ao lado do campo */
.agsbinho { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; padding: 0; margin-left: 6px; border: 1px solid #E0DACB; border-radius: 8px; background: #FFFFFF; cursor: pointer; vertical-align: -6px; }
.agsbinho:hover { border-color: #A68B4D; background: #F2EFE6; }
.agsbinho img { width: 20px; height: 20px; object-fit: contain; }
.balao-agsbinho { position: fixed; inset: 0; z-index: 90; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 24px; background: rgba(0, 60, 82, 0.45); }
.balao-agsbinho .balao-figura { width: 96px; height: 96px; object-fit: contain; }
.balao-agsbinho .balao-texto { max-width: 460px; background: #FFFFFF; border: 1px solid #E0DACB; border-top: 4px solid #A68B4D; border-radius: 8px; padding: 18px 20px; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18); }
.balao-agsbinho .balao-texto p { margin: 0; color: #003C52; font-size: 15px; line-height: 1.5; }
.balao-agsbinho .balao-fechar { padding: 9px 22px; border: 0; border-radius: 8px; background: #003C52; color: #FFFFFF; font-size: 14px; font-weight: 700; cursor: pointer; white-space: nowrap; }

/* Nomes das empresas dentro da meta, sem cortar palavra */
.empresas-da-meta { display: block; white-space: normal; overflow-wrap: normal; word-break: keep-all; line-height: 1.6; }
.grupo-ajuda { margin-top: 22px; padding-top: 10px; border-top: 2px solid #A68B4D; font-size: 15px; }

/* Respiro padrao do texto dentro do cartao, o texto nao encosta no titulo */
.cartao p.item-info { margin: 0 0 10px; line-height: 1.55; }
.cartao p.item-info:last-child { margin-bottom: 0; }
.cartao h2 + p.item-info { margin-top: 2px; }
.cartao p.hist { line-height: 1.55; }
.cartao > .botao, .cartao > form > .botao { margin-top: 14px; }
.cartao a.botao { display: block; margin-top: 14px; }
.cartao p.acoes { margin: 14px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cartao p.erro, .cartao p.ok { margin: 0 0 12px; }


/* Respiro padrao: nenhum texto encosta no titulo nem no botao */
.cartao h2 { margin: 0 0 14px; }
.cartao p { margin: 0 0 10px; line-height: 1.55; }
.cartao p:last-child { margin-bottom: 0; }
.cartao h2 + p { margin-top: 0; }
.cartao form { margin-top: 14px; }
.cartao .periodo + form { margin-top: 8px; }
.campo-barrado { border: 2px solid #B03A2E; border-radius: 8px; padding: 12px; margin: 12px 0; background: #FDF3F2; }
.campo-barrado label { color: #B03A2E; }
form.descartar { margin-top: 10px; }
form.descartar .perigo { background: #FFFFFF; color: #B03A2E; border: 1px solid #B03A2E; }
form.descartar .perigo:hover { background: #FDF3F2; }

/* Ajustes organizados por assunto, em cartoes */
.grade-ajustes { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin-top: 12px; }
.cartao-ajuste { display: block; padding: 14px 16px; border: 1px solid #E0DACB; border-left: 4px solid #A68B4D; border-radius: 8px; background: #FFFFFF; text-decoration: none; transition: border-color .15s, background .15s; }
.cartao-ajuste:hover { border-color: #003C52; border-left-color: #003C52; background: #F7F5EF; }
.cartao-ajuste strong { display: block; color: #003C52; font-size: 14px; margin-bottom: 5px; }
.cartao-ajuste span { display: block; color: #6E6E6E; font-size: 12.5px; line-height: 1.5; }


}

/* Figura do AGsBinho: um tamanho so em toda a tela Como usar */
.card-ajuda { align-items: flex-start; }
.card-ajuda .card-figura { width: 110px; height: 110px; flex: 0 0 110px; object-fit: contain; }
.card-ajuda .card-texto h2 { margin-top: 0; }
@media (max-width: 520px) { .card-ajuda .card-figura { width: 96px; height: 96px; flex: none; } }



/* ===================================================================
   PADRAO DO SISTEMA METAS AGsB
   Uma escala de texto e um tamanho de mascote, valendo em TODA tela.
   =================================================================== */
:root {
  --t-titulo-tela: 18px;
  --t-titulo-cartao: 16px;
  --t-corpo: 14.5px;
  --t-apoio: 13px;
  --t-rotulo: 13px;
  --t-etiqueta: 11px;
  --t-campo: 15px;
  --cor-corpo: #3F3F3F;
  --cor-apoio: #6E6E6E;
  --mascote: 104px;
  --mascote-celular: 72px;
}

.topo h1 { font-size: var(--t-titulo-tela); }
.cartao h2, .entrada h1 { font-size: var(--t-titulo-cartao); line-height: 1.4; }
.cartao p, .cartao .hist, .cartao .anotacao, .cartao .passos li, .cartao li,
.entrada p { font-size: var(--t-corpo); line-height: 1.6; color: var(--cor-corpo); }
.item-info, .cartao .item-info, .cartao p.item-info { font-size: var(--t-apoio); line-height: 1.55; color: var(--cor-apoio); }
label { font-size: var(--t-rotulo); }
.etiqueta, .selo-incluido, .selo-bussola, .selo-adicional { font-size: var(--t-etiqueta); }
.tabela { font-size: var(--t-corpo); }
.tabela th { font-size: var(--t-apoio); }
input, select, textarea, input[type=date], input[type=month], input[type=email] { font-size: var(--t-campo); font-family: inherit; }
.erro, .ok { font-size: var(--t-corpo); }
.cartao .anotacao { margin: 8px 0 0; }
.cartao .passos { margin: 8px 0 0 20px; }
.cartao .passos li { margin-bottom: 9px; }

/* O mascote tem UM tamanho. As figuras foram normalizadas em 320 x 320,
   com o boneco sempre na mesma altura, entao a caixa quadrada basta. */
.card-ajuda { display: flex; align-items: flex-start; gap: 18px; }
.card-ajuda .card-figura { width: var(--mascote); height: var(--mascote); flex: 0 0 var(--mascote); object-fit: contain; }
.card-ajuda .card-texto { flex: 1 1 auto; min-width: 0; }
.card-ajuda .card-texto h2 { margin: 0 0 8px; }
.card-ajuda .card-numero { display: inline-block; margin-bottom: 6px; }
.balao-agsbinho .balao-figura { width: var(--mascote); height: var(--mascote); object-fit: contain; }
@media (max-width: 520px) {
  .card-ajuda { flex-direction: row; text-align: left; gap: 12px; }
  .card-ajuda .card-figura { width: var(--mascote-celular); height: var(--mascote-celular); flex: 0 0 var(--mascote-celular); }
}

/* Etiqueta de aparelho no mesmo tom da etiqueta numerada dos passos */
.marca-aparelho { background: #A68B4D; color: #FFFFFF; font-weight: 700; font-size: 12px; padding: 2px 10px; border-radius: 8px; letter-spacing: 0.02em; }

/* Calendário do cliente */
.calendario { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; margin-top: 10px; width: 100%; max-width: 100%; }
.cal-cabeca { text-align: center; font-size: 11px; font-weight: 700; color: #003C52; letter-spacing: 0.04em; padding: 6px 0; white-space: nowrap; }
.cal-dia { min-height: 88px; border: 1px solid #E7E2D6; border-radius: 6px; background: #FFFFFF; padding: 5px; display: flex; flex-direction: column; gap: 3px; }
.cal-vazio { background: transparent; border-color: transparent; }
.cal-hoje { border-color: #003C52; border-width: 2px; }
.cal-numero { font-size: 12px; font-weight: 700; color: #6E6E6E; }
.cal-hoje .cal-numero { color: #003C52; }
.cal-item { display: block; font-size: 10.5px; line-height: 1.3; padding: 3px 5px; border-radius: 4px; color: #FFFFFF; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.c-vence { background: #003C52; }
.c-atrasado { background: #B03A2E; }
.c-entregue { background: #A68B4D; }
@media (max-width: 640px) {
  .cal-dia { min-height: 64px; padding: 3px; }
  .cal-item { font-size: 9px; padding: 2px 3px; }
}

/* Comunicados da AGsB */
.comunicado { padding: 12px 14px; border-left: 4px solid #A68B4D; background: #F7F5EF; border-radius: 6px; margin-bottom: 10px; }
.comunicado:last-child { margin-bottom: 0; }
.comunicado strong { color: #003C52; }
.comunicado p { margin: 6px 0 6px; }
.comunicado-importante { border-left-color: #B03A2E; background: #FDF3F2; }

/* Sem espaço sobrando no fim da tabela e do cartão */
.tabela tr:last-child td { border-bottom: none; }
.rolagem { margin-bottom: 0; }
.rolagem table { margin-bottom: 0; }
.cartao > .rolagem:last-child, .cartao > table:last-child { margin-bottom: 0; }
.cartao > *:last-child { margin-bottom: 0; }
.calendario { margin-bottom: 0; }

/* Atualizar a tela, para o aplicativo que travou */
.topo-acoes { display: flex; align-items: center; gap: 14px; white-space: nowrap; }
.topo-atualizar { color: #cfe0e8; text-decoration: none; font-size: 14px; border: 1px solid rgba(255,255,255,0.35); padding: 4px 12px; border-radius: 8px; }
.topo-atualizar:hover { background: rgba(255,255,255,0.12); }

/* Aviso de que a AGsB está vendo como cliente */
.faixa-espiar { background: #003C52; color: #FFFFFF; padding: 9px 16px; font-size: 13px; text-align: center; }
.faixa-espiar a { color: #FDEBCD; font-weight: 700; }

/* Contato que leva a algum lugar */
.contatos { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; margin-top: 10px; }
.contato-item { display: block; padding: 12px 14px; border: 1px solid #E0DACB; border-left: 4px solid #A68B4D; border-radius: 8px; background: #FFFFFF; text-decoration: none; }
.contato-item:hover { border-color: #003C52; border-left-color: #003C52; background: #F7F5EF; }
.contato-rotulo { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.06em; color: #A68B4D; text-transform: uppercase; margin-bottom: 3px; white-space: nowrap; }
.contato-valor { display: block; font-size: 14.5px; color: #003C52; font-weight: 600; white-space: nowrap; }

/* Topo: selo, título e ações, sem sobrepor e sem brigar com regra antiga */
.topo { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: nowrap; }
.topo .selo { flex: 0 0 34px; margin: 0; }
.topo h1 { flex: 1 1 auto; min-width: 0; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topo .topo-acoes { flex: 0 0 auto; margin-left: auto; display: flex; align-items: center; gap: 10px; }
.topo .topo-acoes a { margin-left: 0; }
.topo-atualizar { display: inline-block; line-height: 1.2; padding: 5px 14px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.4); color: #FFFFFF; font-size: 13px; font-weight: 600; text-decoration: none; }
.topo-atualizar:hover { background: rgba(255,255,255,0.14); }
@media (max-width: 560px) {
  .topo { padding: 12px 14px; gap: 8px; }
  .topo h1 { font-size: 15px; }
  .topo .topo-acoes { gap: 8px; }
  .topo-atualizar { padding: 5px 11px; font-size: 12px; }
  .topo .topo-acoes a { font-size: 12px; }
}


/* Menu que cabe no celular: nada sai da tela e todo item recebe o toque */
.menu { flex-wrap: wrap; }
.menu a { flex: 1 1 auto; min-width: 0; white-space: normal; overflow-wrap: break-word; }
@media (max-width: 560px) {
  .menu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; padding: 10px 12px 0; }
  .menu a { border-radius: 6px; border-bottom: 1px solid #E3DFD3; padding: 11px 8px; line-height: 1.2; }
  .menu a.ativo { border-color: #003C52; }
}
@media (max-width: 380px) {
  .menu { grid-template-columns: minmax(0, 1fr); }
}

/* Abas de Prazos: lista e calendario na mesma tela */
.abas { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 4px; }
.abas .botao-pequeno { background: #FFFFFF; color: #003C52; border: 1px solid #E3DFD3; }
.abas .botao-pequeno:hover { border-color: #A68B4D; }
.abas .botao-pequeno.ativo { background: #003C52; color: #FFFFFF; border-color: #003C52; }

/* Atualizar, discreto no fim da tela */


/* Abertura do aplicativo, com o AGsBinho do aviso de recebimento */
.abertura { display: flex; align-items: center; gap: 16px; }
.abertura img { width: 96px; height: auto; flex: 0 0 96px; }
.abertura h2 { margin: 0 0 4px; }
@media (max-width: 520px) { .abertura img { width: 76px; flex: 0 0 76px; } }


/* Urgente: contato direto da AGsB, clicavel */
.urgencia { margin: 12px 0 4px; padding: 14px 16px; border: 1px solid #E0DACB; border-left: 4px solid #C0392B; border-radius: 8px; background: #FFFBF5; }
.urgencia-titulo { margin: 0 0 10px; font-weight: 700; color: #003C52; font-size: var(--t-corpo); }
.urgencia-contatos { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
.urgencia-contatos .contato-item { flex: 1 1 200px; }


/* Tela de entrada e convite: o AGsBinho no tamanho da criacao dela */
.agsbinho-entrada { display: block; width: 180px; max-width: 70%; height: auto; margin: 0 auto 10px; }


/* Tela alinhada e sem tremor. Largura unica e barra de rolagem com lugar fixo */
:root { --largura: 1280px; }
html { scrollbar-gutter: auto; overflow-y: auto; }
body { overflow-x: hidden; }
.cartao { scrollbar-gutter: stable; }
.rolagem { scrollbar-gutter: stable; }


/* Minha empresa: cadastro em linhas, rotulo e valor lado a lado */
.rotulo-cadastro { display: inline-block; min-width: 168px; color: #A68B4D; font-size: var(--t-rotulo); font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase; }
@media (max-width: 560px) {
  .rotulo-cadastro { display: block; min-width: 0; margin-bottom: 2px; }
}
.contatos { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }


/* Fim da tela: respiro entre o Atualizar, a marca e a autoria */



/* Fim da tela: um bloco so, sem linha solta e sem vao */
.autoria { margin: 0 auto; padding: 6px 18px 26px; border: 0; }
.autoria .selo { opacity: 0.9; }


/* Consulta por vencimento */
.rotulo-filtro { margin: 16px 0 6px; font-size: var(--t-rotulo); font-weight: 700; letter-spacing: 0.06em; color: #A68B4D; text-transform: uppercase; }
.atalhos { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.atalhos .botao-pequeno { background: #FFFFFF; color: #003C52; border: 1px solid #E3DFD3; }
.atalhos .botao-pequeno:hover { border-color: #A68B4D; }
.atalhos .botao-pequeno.ativo { background: #003C52; color: #FFFFFF; border-color: #003C52; }
.par-data { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.par-data label { margin: 0; font-size: var(--t-rotulo); color: #6E6E6E; white-space: nowrap; }
.par-data input { margin: 0; width: auto; }


/* Fila de entrega: cabe na tela, sem sobra e sem corte */
.tabela-fila { table-layout: fixed; width: 100%; min-width: 0; font-size: 13.5px; }
.tabela-fila th, .tabela-fila td { padding: 6px 8px; vertical-align: middle; }
.tabela-fila th { font-size: 11px; }
.tabela-fila .col-empresa { width: 19%; }
.tabela-fila .col-obrigacao { width: 30%; }
.tabela-fila .col-setor { width: 11%; }
.tabela-fila td, .tabela-fila th { overflow: hidden; text-overflow: ellipsis; }
.tabela-fila .etiqueta { font-size: 10.5px; padding: 2px 8px; }
.tabela-fila .atraso { font-size: 10.5px; }
@media (max-width: 760px) {
  .tabela-fila { table-layout: auto; min-width: 640px; }
}


/* Empresa aberta pela fila de entrega, em destaque */
.linha-foco > td { background: #FFF6E2; }
.linha-foco > td:first-child { box-shadow: inset 4px 0 0 #A68B4D; }


/* Link na cor da casa, sem roxo de visitado */
.corpo a:visited { color: inherit; }
.tabela a, .tabela a:visited { color: #003C52; text-decoration: none; border-bottom: 1px solid rgba(0, 60, 82, 0.22); padding-bottom: 1px; }
.tabela a:hover { color: #A68B4D; border-color: #A68B4D; }
.tabela a.botao-pequeno, .tabela a.botao-pequeno:visited { color: #FFFFFF; border-bottom: 0; padding-bottom: 7px; }
.hist a, .hist a:visited, .item-info a, .item-info a:visited { color: #003C52; }


/* O nome da empresa em dourado, a cor dos clientes da AGsB */
.tabela-fila .col-empresa a, .tabela-fila .col-empresa a:visited { color: #A68B4D; font-weight: 700; border-bottom-color: rgba(166, 139, 77, 0.35); }
.tabela-fila .col-empresa a:hover { color: #003C52; border-bottom-color: #003C52; }


/* Vencida em aberto: linha marcada em vermelho de alerta */
.linha-vencida > td { background: #FDF3F2; }
.linha-vencida > td:first-child { box-shadow: inset 4px 0 0 #B03A2E; }
.tabela td.venceu { color: #B03A2E; font-weight: 700; }
.tabela-fila .linha-vencida .atraso { display: inline-block; margin: 0 0 0 6px; background: #B03A2E; color: #FFFFFF; padding: 1px 7px; border-radius: 8px; font-size: 10px; }


/* Tela do cliente: sem vermelho, o alerta forte e so do lado da AGsB */
.prazo-passou { display: inline-block; margin-top: 4px; font-size: var(--t-etiqueta); font-weight: 700; color: #8A8A8A; }


/* Botao nunca apaga, mesmo depois de visitado */
.corpo a.botao-pequeno, .corpo a.botao-pequeno:visited,
.corpo a.botao, .corpo a.botao:visited,
.tabela a.botao-pequeno, .tabela a.botao-pequeno:visited { color: #FFFFFF; }
.abas a.botao-pequeno:not(.ativo), .abas a.botao-pequeno:not(.ativo):visited,
.atalhos a.botao-pequeno:not(.ativo), .atalhos a.botao-pequeno:not(.ativo):visited { color: #003C52; }
.corpo a.botao-voltar, .corpo a.botao-voltar:visited { color: #003C52; }
.corpo a.contato-item, .corpo a.contato-item:visited { color: inherit; }
.corpo a.contato-item .contato-valor { color: #003C52; }
.corpo a.item, .corpo a.item:visited { color: inherit; }


/* Fim do tremor: cartao nao vira area rolavel em tela larga */
.cartao { overflow-x: visible; scrollbar-gutter: auto; }
.cartao::-webkit-scrollbar { height: 0; width: 0; }
@media (max-width: 900px) {
  .cartao { overflow-x: auto; }
  .cartao::-webkit-scrollbar { height: 6px; }
}
.rolagem { overflow-x: auto; scrollbar-gutter: auto; }
.rolagem::-webkit-scrollbar { height: 8px; }
.rolagem::-webkit-scrollbar-track { background: #F2EFE6; border-radius: 4px; }
.rolagem::-webkit-scrollbar-thumb { background: #A68B4D; border-radius: 4px; }

/* fila de prazos por empresa e resposta ao comunicado */
.item.item-vencido { background: #FDF3F2; }
.item.item-vencido .item-titulo { color: #B03A2E; }
.responde-comunicado { margin-top: 10px; }
.responde-comunicado label { display: block; font-size: 13px; color: #5A5A5A; margin-bottom: 4px; }
.responde-comunicado textarea { width: 100%; box-sizing: border-box; }
.responde-comunicado button { width: auto; margin-top: 6px; }

/* confirmacao de exclusao de solicitacao */
.confirma-exclusao { border: 1px solid #B03A2E; border-radius: 8px; padding: 12px; margin-top: 12px; background: #FDF3F2; }
.confirma-exclusao .linha-botoes button { width: auto; }


/* escolha da ordem das empresas */
.ordem-empresas { display: inline-flex; align-items: center; gap: 6px; margin-left: 10px; font-weight: 400; }
.ordem-empresas .item-info { margin: 0; }
.ordem-empresas .botao-pequeno { padding: 2px 10px; font-size: 12px; white-space: nowrap; }

/* linha de usuarios alinhada */
.tabela td { vertical-align: middle; }
.acao-linha { display: inline-block; margin: 0 0 0 8px; }
.acao-linha button { width: auto; min-width: 104px; margin: 0; }
.acao-linha button { min-width: 104px; }
.tabela td.acoes .botao-pequeno, .tabela td.acoes button { white-space: nowrap; }
.tabela { width: 100%; }
.tabela td, .tabela th { word-break: normal; }

/* lista de clientes: cabe na largura, sem cortar coluna */
.tabela-clientes { table-layout: auto; width: 100%; font-size: 13.5px; }
.tabela-clientes td, .tabela-clientes th { padding: 6px 8px; white-space: nowrap; }
.tabela-clientes .apelido { max-width: 190px; overflow: hidden; text-overflow: ellipsis; }
.tabela-clientes td.acoes { text-align: right; width: 1%; }
.tabela-clientes td.acoes .botao-pequeno { padding: 4px 9px; font-size: 12.5px; margin-left: 4px; }

/* cartao que abre so quando ela clica */
details.cartao-abre > summary { cursor: pointer; list-style: none; font-weight: 700; color: #003C52; font-size: 16px; padding: 2px 0; }
details.cartao-abre > summary::-webkit-details-marker { display: none; }
details.cartao-abre > summary::before { content: '+ '; color: #A68B4D; font-weight: 700; }
details.cartao-abre[open] > summary::before { content: '\2212 '; }
details.cartao-abre[open] > summary { margin-bottom: 10px; }

/* lista alta demais: caixa com rolagem propria e cabecalho preso */
.caixa-lista .tabela th { position: sticky; top: 0; background: #FFFFFF; z-index: 2; box-shadow: 0 1px 0 #003C52; }
.caixa-lista .tabela { margin: 0; }

/* busca e paginacao da lista */
.linha-lista { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.busca-lista { display: flex; align-items: center; gap: 6px; margin: 0; }
.busca-lista input { margin: 0; width: 260px; flex: 0 0 260px; padding: 7px 10px; font-size: 14px; }
.busca-lista button { width: auto; }
.busca-lista button, .busca-lista .botao-pequeno { margin: 0; }
.paginacao { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.paginacao .botao-pequeno.ativo { background: #A68B4D; }

/* nome da empresa abre a alteracao */
.tabela-clientes .apelido a { color: #A68B4D; font-weight: 700; text-decoration: none; }
.tabela-clientes .apelido a:hover { text-decoration: underline; }

/* rodape mais enxuto para a lista caber na tela */
.autoria { padding: 4px 18px 10px; line-height: 1.5; }
.autoria .selo { margin-bottom: 4px; }
.corpo { padding-bottom: 6px; }

/* a logo desce para o fim da tela sem alongar a pagina */
body { min-height: 100vh; display: flex; flex-direction: column; }
.corpo { flex: 1 0 auto; }
.autoria { flex: 0 0 auto; margin-top: auto; }

/* relatorio cabe na largura, sem barra lateral */
.tela-relatorios .tabela { table-layout: fixed; width: 100%; font-size: 13.5px; }
.tela-relatorios .tabela td, .tela-relatorios .tabela th { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 7px 8px; }
.tela-relatorios .rolagem { overflow-x: hidden; }

/* filtro de solicitacoes em uma linha compacta */
.tela-solicitacoes .cartao:has(> .filtro) { padding: 12px 16px; }
.tela-solicitacoes .filtro { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px; margin: 0; }
.tela-solicitacoes .filtro > div { margin: 0; }
.tela-solicitacoes .filtro label { margin-bottom: 4px; display: block; }
.tela-solicitacoes .filtro select { margin: 0; min-width: 190px; }

/* tela de usuarios: tudo dentro do cartao, sem barra lateral */
.tela-usuarios .tabela { table-layout: fixed; width: 100%; min-width: 0; font-size: 13.5px; }
.tela-usuarios .tabela td, .tela-usuarios .tabela th { padding: 7px 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tela-usuarios .tabela td.termo { white-space: normal; overflow: visible; }
.tela-usuarios .tabela td { vertical-align: top; }
.tela-usuarios .tabela td.acoes { overflow: visible; }
.tela-usuarios .tabela td.acoes, .tela-usuarios .tabela th:last-child { width: auto; padding-left: 8px; text-align: right; }
.tela-usuarios .acoes form { margin: 0; }
.tela-usuarios .acoes button, .tela-usuarios .acoes .botao-pequeno { padding: 5px 10px; font-size: 12.5px; }
.tela-usuarios .termo .acao-linha { display: block; margin: 5px 0 0; }
.tela-usuarios .termo .botao-pequeno { padding: 4px 9px; font-size: 12px; }
.tela-usuarios td.nome-acesso a { color: #A68B4D; font-weight: 700; text-decoration: none; }
.tela-usuarios td.nome-acesso a:hover { text-decoration: underline; }
.tela-usuarios .cartao { overflow-x: hidden; }

/* Ajustes no padrao do sistema, grade que acompanha a largura */
.grade-ajustes { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.tela-ajustes .rolagem { overflow-x: hidden; }

/* lista do sistema: filtro, campo e tabela em uma tela */
.tela-ajustes .cartao > p.acoes { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.tela-ajustes .cartao > p.acoes .botao-pequeno { padding: 6px 11px; }
.form-lista { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; margin: 0 0 12px; }
.form-lista > * { margin: 0; }
.form-lista label { flex: 0 0 auto; padding-bottom: 9px; }
.form-lista input[type=text] { flex: 1 1 200px; width: auto; }
.form-lista select { flex: 0 1 230px; width: auto; }
.form-lista button { width: auto; flex: 0 0 auto; }
.tela-ajustes .tabela td, .tela-ajustes .tabela th { padding: 6px 8px; }
.tela-ajustes .tabela td.acoes .botao-pequeno, .tela-ajustes .tabela td.acoes button { padding: 4px 9px; font-size: 12px; }
.tela-ajustes .tabela td.acoes form { margin: 0 0 0 6px; }

/* tela de usuarios: acoes empilhadas, nada saindo do cartao */
.tela-usuarios .tabela td.acoes { white-space: normal; text-align: right; padding: 6px 8px; }
.tela-usuarios .tabela td.acoes form { display: block; margin: 0 0 4px; }
.tela-usuarios .tabela td.acoes .botao-pequeno, .tela-usuarios .tabela td.acoes button { display: block; width: 100%; box-sizing: border-box; margin: 0 0 4px; padding: 5px 8px; font-size: 12px; text-align: center; }
.tela-usuarios .termo .acao-linha { display: block; margin: 5px 0 0; }
.tela-usuarios .termo .botao-pequeno { display: inline-block; padding: 4px 9px; font-size: 12px; }

/* CELULAR: nada sai da largura da tela, 11/09/2026 */
@media (max-width: 760px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  .corpo { padding-left: 12px; padding-right: 12px; }
  .cartao { overflow-x: hidden; }
  .rolagem { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .tabela { min-width: 0; width: 100%; font-size: 13px; }
  .tabela td, .tabela th { white-space: normal; overflow-wrap: anywhere; padding: 7px 6px; }
  .tabela td.num, .tabela td.uma-linha { white-space: nowrap; }
  .calendario { gap: 3px; }
  .cal-dia { min-height: 56px; padding: 3px; }
  .cal-cabeca { font-size: 10px; padding: 4px 0; }
  .cal-item { font-size: 9px; }
  .menu { flex-wrap: wrap; }
  input, select, textarea, button { max-width: 100%; }
}
@media (max-width: 430px) {
  .cal-dia { min-height: 46px; }
  .cal-numero { font-size: 11px; }
  .tabela { font-size: 12.5px; }
}

/* calendario nunca passa da largura da tela */
.calendario, .calendario * { min-width: 0; }
.cal-dia { overflow: hidden; }
.cal-item { max-width: 100%; }
@media (max-width: 760px) {
  .calendario { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px; }
  .cal-dia { padding: 2px; }
  .cal-item { font-size: 8.5px; padding: 1px 2px; }
}

/* celular: nada define largura maior que a tela */
@media (max-width: 760px) {
  body { min-width: 0; }
  .corpo, .cartao, .rolagem, .tabela, .calendario { max-width: 100%; }
  .rolagem .tabela, .tabela { min-width: 0; }
  .tabela td, .tabela th { white-space: normal; overflow-wrap: anywhere; }
  .tabela td.num { white-space: nowrap; }
  .periodo { display: flex; flex-wrap: wrap; gap: 8px; }
  .periodo .botao-pequeno { flex: 1 1 auto; text-align: center; }
  .legenda { display: flex; flex-wrap: wrap; gap: 8px; font-size: 11px; }
}

/* menu que ela arrasta */
.menu-arrasta a { cursor: grab; }
.menu-arrasta a.arrastando { opacity: 0.45; }
.menu-arrasta a.alvo { outline: 2px dashed #A68B4D; outline-offset: 2px; }
.menu-dica { max-width: var(--largura); margin: 2px auto 0; padding: 0 18px; font-size: 11px; color: #8A8A8A; text-align: center; }
@media (max-width: 760px) { .menu-dica { display: none; } }

/* PAINEL EM GRAFICO, 11/09/2026 */
.painel-topo { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 12px; }
.painel-mes { display: flex; align-items: center; gap: 8px; background: #FFFFFF; border-radius: 8px; padding: 8px 14px; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
.painel-mes label { margin: 0; font-size: 11px; color: #A68B4D; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }
.painel-mes input { margin: 0; width: auto; padding: 6px 10px; border-radius: 8px; }
.painel-numeros { display: flex; flex: 1 1 auto; flex-wrap: wrap; gap: 10px; }
.bolha { flex: 1 1 130px; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; border: 0; border-radius: 8px; padding: 12px 16px; cursor: pointer; font-family: inherit; text-align: left; box-shadow: 0 1px 2px rgba(0,0,0,0.05); }
.bolha strong { font-size: 26px; line-height: 1; }
.bolha span { font-size: 11.5px; opacity: 0.85; }
.b-vermelha { background: #B03A2E; color: #FFFFFF; }
.b-dourada { background: #A68B4D; color: #FFFFFF; }
.b-azul { background: #003C52; color: #FFFFFF; }
.b-clara { background: #FFFFFF; color: #003C52; cursor: default; }

.painel-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 12px; align-items: start; }
.cartao-grafico { border-radius: 8px; padding: 16px 18px; }
.cartao-grafico h2 { font-size: 15px; margin: 0 0 10px; }

.rosca-area { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.rosca { width: 150px; height: 150px; flex: 0 0 150px; }
.rosca .fatia { cursor: pointer; transition: opacity 0.15s; }
.rosca .fatia:hover { opacity: 0.78; }
.rosca-num { font-size: 26px; font-weight: 700; fill: #003C52; }
.rosca-rot { font-size: 9px; fill: #8A8A8A; letter-spacing: 0.06em; text-transform: uppercase; }
.rosca-legenda { flex: 1 1 180px; display: flex; flex-direction: column; gap: 4px; }
.legenda-item { display: flex; align-items: center; gap: 8px; width: 100%; background: transparent; border: 0; border-radius: 8px; padding: 5px 8px; cursor: pointer; font-family: inherit; font-size: 12.5px; color: #5A5A5A; text-align: left; }
.legenda-item:hover { background: #F7F5EF; }
.ponto-cor { width: 11px; height: 11px; border-radius: 8px; flex: 0 0 11px; }
.legenda-nome { flex: 1 1 auto; }
.legenda-num { font-weight: 700; color: #003C52; }

.barra-toca { display: flex; align-items: center; gap: 10px; width: 100%; background: transparent; border: 0; border-radius: 8px; padding: 5px 8px; margin: 0 0 2px; cursor: pointer; font-family: inherit; text-align: left; }
.barra-toca:hover { background: #F7F5EF; }
.barra-toca .barra-fundo { border-radius: 8px; }
.barra-toca .barra-cheia { border-radius: 8px; }

.colunas-redondas .coluna-parte:last-child { border-radius: 8px 8px 0 0; }
.colunas-redondas .coluna-pilha { border-radius: 8px; overflow: hidden; }

.fichas { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.ficha { display: flex; flex-direction: column; background: #F7F5EF; border-radius: 8px; padding: 8px 12px; font-size: 11.5px; color: #5A5A5A; }
.ficha strong { font-size: 18px; color: #003C52; line-height: 1.2; }

.cartao-detalhe { border-radius: 8px; margin-top: 12px; }
.cartao-detalhe .rolagem { max-height: 320px; overflow-y: auto; }

@media (max-width: 760px) {
  .painel-grade { grid-template-columns: minmax(0, 1fr); }
  .rosca { width: 130px; height: 130px; flex: 0 0 130px; }
  .bolha strong { font-size: 22px; }
}

/* painel cabe em uma tela */

.tela-painel .painel-grade { grid-template-columns: repeat(auto-fit, minmax(285px, 1fr)); gap: 10px; }
.tela-painel .cartao-grafico { padding: 13px 15px; }
.tela-painel .cartao-grafico h2 { font-size: 14px; margin: 0 0 8px; }
.tela-painel .rosca { width: 128px; height: 128px; flex: 0 0 128px; }
.tela-painel .barra-toca { padding: 3px 7px; font-size: 12.5px; }
.tela-painel .colunas { height: 120px; }
.tela-painel .bolha { padding: 10px 14px; }
.tela-painel .bolha strong { font-size: 22px; }
.tela-painel .cartao-detalhe .rolagem { max-height: 240px; }
.tela-painel .autoria { padding: 2px 18px 6px; }
@media (max-width: 1280px) { .tela-painel .corpo { max-width: 100%; } }

/* painel: aperto fino para caber */
.tela-painel .painel-grade { gap: 8px; }
.tela-painel .cartao-grafico { padding: 11px 13px; }
.tela-painel .rosca { width: 112px; height: 112px; flex: 0 0 112px; }
.tela-painel .rosca-area { gap: 10px; }
.tela-painel .legenda-item { padding: 2px 6px; font-size: 12px; }
.tela-painel .colunas { height: 104px; }
.tela-painel .painel-topo { margin-bottom: 8px; gap: 8px; }
.tela-painel .voltar { margin: 0 0 6px; }
.tela-painel .fichas { gap: 6px; }
.tela-painel .ficha { padding: 6px 10px; }
.tela-painel .ficha strong { font-size: 16px; }
.tela-painel .medidor { margin: 2px 0 8px; }
.tela-painel .item-info { font-size: 11px; margin: 6px 0 0; }
.tela-painel .colunas { height: 88px; }
.tela-painel .rosca-legenda { gap: 1px; }
.tela-painel .cartao-grafico h2 { font-size: 13.5px; margin: 0 0 6px; }
.tela-painel .bolha { padding: 8px 12px; }
.tela-painel .bolha strong { font-size: 20px; }
.tela-painel .legenda { margin: 6px 0 0; }
.tela-painel .barra-linha { margin: 0 0 1px; }

/* frase de lista vazia sem buraco na tela */
.vazio { padding: 14px 10px; }

/* tela da entrega da empresa: dois blocos por linha, cabe em uma tela */
.tela-entrega .corpo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; }
.tela-entrega .voltar, .tela-entrega .ok, .tela-entrega .erro { grid-column: 1 / -1; margin: 0; }
.tela-entrega .cartao { margin: 0; }
@media (max-width: 760px) { .tela-entrega .corpo { grid-template-columns: minmax(0, 1fr); } }

/* TELAS LONGAS CABEM EM UMA TELA, 11/09/2026 */
/* Prazos: a fila em colunas, no mesmo padrao do Painel */

.tela-index .cartao > .item { break-inside: avoid; }
.tela-index .cartao { column-count: 3; column-gap: 14px; }
.tela-index .cartao > h2, .tela-index .cartao > .item-info { column-span: all; }
@media (max-width: 1100px) { .tela-index .cartao { column-count: 2; } }
@media (max-width: 760px) { .tela-index .cartao { column-count: 1; } .tela-index .corpo, .tela-tudo .corpo, .tela-ajuda .corpo { max-width: 100%; } }

/* Metas: a lista rola dentro do quadro, a pagina fica parada */


/* Como usar: os blocos em tres colunas */
.tela-ajuda .corpo { column-count: 3; column-gap: 14px; }
.tela-ajuda .cartao { break-inside: avoid; display: inline-block; width: 100%; margin: 0 0 12px; }
.tela-ajuda .voltar { column-span: all; }
@media (max-width: 1100px) { .tela-ajuda .corpo { column-count: 2; } }
@media (max-width: 760px) { .tela-ajuda .corpo { column-count: 1; } }

/* Calendario da AGsB: cabe sem descer */
.tela-index .calendario { max-width: 100%; }

/* aperto final das telas longas */
.tela-index .cartao > .item { padding: 8px 10px; margin: 0 0 8px; }

.tela-index .item strong { font-size: 13.5px; }
.tela-index .item .item-info { font-size: 11.5px; }
.tela-index .calendario .cal-dia { min-height: 62px; }
.tela-index .cartao { max-height: 620px; overflow-y: auto; }

.tela-entrega .cartao h2 { font-size: 14.5px; margin: 0 0 8px; }
.tela-entrega .rolagem { max-height: 240px; overflow-y: auto; }
.tela-ajuda .corpo { column-count: 4; }

.tela-ajuda .cartao h2 { font-size: 14px; }
@media (max-width: 1100px) { .tela-ajuda .corpo { column-count: 2; } }

/* COMO USAR EM ABAS, 11/09/2026 */
.tela-ajuda .corpo { column-count: initial; display: block; }
.tela-ajuda .cartao { display: block; width: auto; margin: 0 0 14px; }
.tela-ajuda .lista-aulas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; }
.tela-ajuda .lista-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; align-items: start; }
.tela-ajuda .lista-aulas .cartao, .tela-ajuda .lista-cards .cartao { margin: 0; }
.tela-ajuda .lista-aulas summary { font-size: 14.5px; }
.tela-ajuda .lista-aulas .card-numero { margin-right: 4px; }
.tela-ajuda .lista-aulas .passos { margin: 6px 0 8px; padding-left: 18px; }
.tela-ajuda .lista-aulas .passos li { margin: 0 0 4px; font-size: 12.5px; }
.tela-ajuda .lista-cards .card-figura { width: 54px; height: auto; }
.tela-ajuda .lista-cards .anotacao { font-size: 12.5px; }
@media (max-width: 1100px) { .tela-ajuda .lista-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .tela-ajuda .lista-aulas, .tela-ajuda .lista-cards { grid-template-columns: minmax(0, 1fr); } }

/* CALENDARIO DA AGsB EM DUAS COLUNAS, 11/09/2026 */
.tela-calendario .corpo { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 10px; align-items: start; width: 100%; }
.tela-calendario .voltar, .tela-calendario .abas, .tela-calendario .ok, .tela-calendario .erro { grid-column: 1 / -1; margin: 0 0 4px; }

.tela-calendario .calendario .cal-dia { min-height: 58px; }
.tela-calendario .cartao .rolagem { max-height: 420px; overflow-y: auto; }
@media (max-width: 900px) { .tela-calendario .corpo { grid-template-columns: minmax(0, 1fr); } }

/* ultimo aperto de Prazos e Metas */
.tela-index .cartao { max-height: 560px; }


/* ultimo ajuste de altura, 11/09/2026 */
.tela-index .cartao { max-height: 500px; }



/* PADRAO UNICO DE TELA, 11/09/2026
   toda tela com a mesma largura, o mesmo cartao e o mesmo espacamento */
.corpo { max-width: var(--largura); width: 100%; }
.cartao { padding: 14px 16px; margin-bottom: 14px; }
.tela-calendario .cartao, .tela-entrega .cartao, .tela-ajuda .lista-aulas .cartao, .tela-ajuda .lista-cards .cartao { margin-bottom: 0; }

/* FORMULARIO PADRAO DO SISTEMA, 11/09/2026
   todo formulario longo em grade, com o rotulo sempre junto do campo */
.formulario { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 16px; align-items: start; }
.formulario > .largo, .formulario > script, .formulario > input[type=hidden] { grid-column: 1 / -1; }
.formulario .campo { margin: 0 0 6px; }
.formulario label { display: block; margin: 0 0 4px; }
.formulario input, .formulario select, .formulario textarea { width: 100%; margin: 0; }
.formulario input[type=checkbox], .formulario input[type=radio], .formulario .marca input { width: auto; }
.formulario .marca { display: flex; align-items: center; gap: 8px; }
.formulario .item-info { margin: 4px 0 0; font-size: 11.5px; }
.formulario button { margin-top: 6px; }
.formulario .lista-marcar { max-height: 120px; overflow-y: auto; }
@media (max-width: 1100px) { .formulario { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .formulario { grid-template-columns: minmax(0, 1fr); } }

/* telas de lista curta em duas colunas, mesmo padrao de Ajustes */
.tela-limpeza .corpo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.tela-limpeza .voltar, .tela-limpeza .ok, .tela-limpeza .erro { grid-column: 1 / -1; margin: 0; }
.tela-limpeza .cartao { margin: 0; }
@media (max-width: 760px) { .tela-limpeza .corpo { grid-template-columns: minmax(0, 1fr); } }

/* ULTIMO AJUSTE PARA CABER, 11/09/2026 */
.tela-nova .formulario { gap: 2px 16px; }
.tela-nova .formulario .campo { margin: 0 0 4px; }
.tela-nova .formulario .lista-marcar { max-height: 92px; }
.tela-nova .formulario textarea { height: 56px; min-height: 56px; }
.tela-nova .formulario .item-info { font-size: 11px; }
.tela-nova .cartao { max-height: calc(100vh - 290px); overflow-y: auto; }

.tela-termo .corpo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.tela-termo .cartao { margin: 0; max-height: calc(100vh - 260px); overflow-y: auto; }
@media (max-width: 900px) { .tela-termo .corpo { grid-template-columns: minmax(0, 1fr); } }

.tela-index .cartao { max-height: 440px; }

.tela-ajuda .lista-aulas .passos li { margin: 0 0 3px; }
.tela-painel .cartao { margin-bottom: 10px; }
.tela-painel .corpo { padding-bottom: 4px; }

/* fila de entrega igual a lista de clientes, 11/09/2026 */
.tela-tudo .rolagem { max-height: none; overflow-y: visible; }
.tela-tudo .tabela { table-layout: fixed; width: 100%; }
.tela-tudo .tabela td, .tela-tudo .tabela th { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* TELA FIXA TAMBEM EM MONITOR MENOR, 11/09/2026 */
.tela-tudo .tabela td, .tela-tudo .tabela th { padding: 6px 8px; }
.tela-tudo .cartao .item { padding: 8px 10px; margin: 0 0 6px; }
.tela-meta .corpo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.tela-meta .voltar, .tela-meta .abas, .tela-meta .ok, .tela-meta .erro, .tela-meta .corpo > .cartao:first-of-type { grid-column: 1 / -1; }
.tela-meta .cartao { margin: 0; }
.tela-meta .tabela td, .tela-meta .tabela th { padding: 6px 8px; }
.tela-meta .lista-marcar { max-height: 130px; }
@media (max-width: 900px) { .tela-meta .corpo { grid-template-columns: minmax(0, 1fr); } }
.tela-nova .cartao { max-height: calc(100vh - 320px); }
.tela-ajuda .lista-cards .passos li { font-size: 12.5px; margin: 0 0 3px; }
.tela-ajuda .lista-cards .card-figura { width: 44px; }
.tela-painel .cartao { margin-bottom: 8px; }

/* ALTURA QUE ACOMPANHA O MONITOR, 11/09/2026
   o rodape continua igual, so o espaco em volta ficou menor */
.autoria { padding: 8px 18px 14px; line-height: 1.55; }
.autoria .selo { margin-bottom: 4px; }

.tela-index .cartao { max-height: calc(100vh - 340px); }
.tela-calendario .cartao .rolagem { max-height: calc(100vh - 420px); }
.tela-calendario .calendario .cal-dia { min-height: 46px; }
.tela-ajuda .lista-aulas, .tela-ajuda .lista-cards { max-height: none; overflow: visible; }
.tela-meta .cartao { max-height: calc(100vh - 330px); overflow-y: auto; }
.tela-meta .corpo > .cartao:first-of-type { max-height: none; overflow: visible; }
.tela-painel .corpo > .cartao, .tela-painel .numeros { margin-bottom: 8px; }
.tela-painel .rosca { max-width: 150px; }
.tela-clientes .cartao { max-height: calc(100vh - 300px); overflow-y: auto; }

/* CALENDARIO: a grade encolhe junto com a coluna, 11/09/2026 */
.tela-calendario .calendario { width: 100%; max-width: 100%; }
.tela-calendario .calendario > * { min-width: 0; }
@media (max-width: 980px) { .tela-calendario .corpo { grid-template-columns: minmax(0, 1fr); } }

/* calibragem final da altura, 11/09/2026 */
.tela-index .cartao { max-height: calc(100vh - 470px); }
.tela-painel .corpo > .cartao, .tela-painel .numeros { margin-bottom: 6px; }
.tela-painel .cartao { padding: 10px 14px; }

/* a tela se ajusta a qualquer altura de monitor, 11/09/2026 */
.tela-calendario .cartao .rolagem { max-height: calc(100vh - 502px); }
.tela-ajuda .lista-aulas, .tela-ajuda .lista-cards { max-height: none; }
.tela-meta .cartao { max-height: calc(100vh - 450px); }
.tela-nova .cartao { max-height: calc(100vh - 380px); }
@media (max-height: 860px) {
  .tela-calendario .calendario .cal-dia { min-height: 36px; }
  .tela-painel .cartao { padding: 8px 12px; }
  .tela-painel .corpo > .cartao, .tela-painel .numeros { margin-bottom: 5px; }
  .tela-painel .rosca { max-width: 118px; }
  .tela-painel .item-info, .tela-painel .legenda { font-size: 11px; }
  .autoria { padding: 4px 18px 8px; line-height: 1.4; }
  .autoria .selo { width: 78px; height: 67px; }
}
.tela-painel .corpo > .cartao, .tela-painel .numeros { margin-bottom: 4px; }
.tela-painel .corpo { padding-bottom: 0; }
.tela-painel .cartao h2 { margin: 0 0 6px; }

.tela-calendario .calendario .cal-dia { overflow: hidden; }
.tela-painel .autoria { padding-bottom: 2px; }
.tela-painel .corpo > .cartao:last-of-type { margin-bottom: 0; }
@media (max-width: 980px) { .tela-calendario .cartao .rolagem { max-height: calc(100vh - 700px); } }

/* sem barra lateral solta, 11/09/2026 */
.tela-calendario .rolagem, .tela-meta .rolagem { overflow-x: hidden; }
.tela-meta .cartao { overflow-x: hidden; }
.tela-meta .dupla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.tela-meta .dupla > div { min-width: 0; }
.tela-meta form input, .tela-meta form select, .tela-meta form textarea { width: 100%; }

/* CAMPO DE DATA LIMPO, 11/09/2026
   o dd/mm/aaaa cru so aparece quando o campo esta em uso */
input[type=date].campo-vazio::-webkit-datetime-edit,
input[type=month].campo-vazio::-webkit-datetime-edit { color: transparent; }
input[type=date].campo-vazio:focus::-webkit-datetime-edit,
input[type=month].campo-vazio:focus::-webkit-datetime-edit { color: #5A5A5A; }
input[type=date]::-webkit-calendar-picker-indicator,
input[type=month]::-webkit-calendar-picker-indicator { opacity: 0.55; cursor: pointer; }
input[type=date]:hover::-webkit-calendar-picker-indicator,
input[type=month]:hover::-webkit-calendar-picker-indicator { opacity: 1; }

/* PAINEL SEM BURACO E DENTRO DA TELA, 11/09/2026 */
.tela-painel .painel-grade { align-items: stretch; }
.tela-painel .painel-grade > .cartao { display: flex; flex-direction: column; }
.tela-painel .rosca-area { flex-wrap: nowrap; }
.tela-painel .rosca { width: 104px; height: 104px; flex: 0 0 104px; max-width: 104px; }
.tela-painel .rosca-legenda { gap: 2px; font-size: 12px; }
.tela-painel .numeros { gap: 8px; }
.tela-painel .cartao h2 { font-size: 14.5px; }
@media (max-height: 960px) {
  .tela-painel .rosca { width: 92px; height: 92px; flex: 0 0 92px; }
  .tela-painel .painel-grade { gap: 7px; }
  .tela-painel .cartao { padding: 8px 12px; }
}
.tela-meta .cartao { max-height: calc(100vh - 560px); }
.tela-meta .corpo > .cartao:first-of-type { max-height: none; }

/* CALENDARIO DENTRO DE PRAZOS NO MESMO PADRAO, 11/09/2026
   o quadro do calendario nao entra nas colunas da lista */
.tela-index .cartao:has(> .calendario) { column-count: initial; max-height: none; overflow: visible; }
.tela-index .cartao > .calendario,
.tela-index .cartao > .periodo,
.tela-index .cartao > .filtro,
.tela-index .cartao > .legenda { column-span: all; }
.tela-index .calendario { width: 100%; max-width: 100%; }
.tela-index .calendario > * { min-width: 0; }
.tela-index .calendario .cal-dia { min-height: 46px; overflow: hidden; }
@media (max-height: 860px) { .tela-index .calendario .cal-dia { min-height: 36px; } }


/* o calendario de Prazos em duas colunas, igual ao Calendario, 11/09/2026 */
.tela-index .corpo:has(.calendario) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 10px; align-items: start; }
.tela-index .corpo:has(.calendario) > .voltar,
.tela-index .corpo:has(.calendario) > .abas,
.tela-index .corpo:has(.calendario) > a.botao,
.tela-index .corpo:has(.calendario) > .ok,
.tela-index .corpo:has(.calendario) > .erro { grid-column: 1 / -1; margin: 0 0 4px; }
.tela-index .corpo:has(.calendario) > .cartao { margin: 0; }
.tela-index .corpo:has(.calendario) .rolagem { max-height: calc(100vh - 420px); overflow-y: auto; overflow-x: auto; }
@media (max-width: 980px) { .tela-index .corpo:has(.calendario) { grid-template-columns: minmax(0, 1fr); } }

/* a relacao do mes cabe na coluna, sem cortar texto, 11/09/2026 */
.tela-index .corpo:has(.calendario) .tabela,
.tela-calendario .tabela { table-layout: auto; width: 100%; font-size: 13px; }
.tela-index .corpo:has(.calendario) .tabela th,
.tela-index .corpo:has(.calendario) .tabela td,
.tela-calendario .tabela th,
.tela-calendario .tabela td { white-space: normal; padding: 6px 6px; }

.tela-index .corpo:has(.calendario) .tabela th:last-child,
.tela-index .corpo:has(.calendario) .tabela td:last-child,
.tela-calendario .tabela th:last-child,
.tela-calendario .tabela td:last-child { text-align: right; }
.tela-index .corpo:has(.calendario) .calendario .cal-dia { min-height: 40px; }

/* relacao do mes: quatro colunas dentro do quadro, 11/09/2026 */
.tela-index .corpo:has(.calendario) .tabela,
.tela-calendario .tabela { table-layout: fixed; width: 100%; font-size: 12.5px; }
.tela-index .corpo:has(.calendario) .tabela th:nth-child(1),
.tela-index .corpo:has(.calendario) .tabela td:nth-child(1),
.tela-calendario .tabela th:nth-child(1),
.tela-calendario .tabela td:nth-child(1) { width: 11%; }
.tela-index .corpo:has(.calendario) .tabela th:nth-child(2),
.tela-index .corpo:has(.calendario) .tabela td:nth-child(2),
.tela-calendario .tabela th:nth-child(2),
.tela-calendario .tabela td:nth-child(2) { width: 40%; }
.tela-index .corpo:has(.calendario) .tabela th:nth-child(3),
.tela-index .corpo:has(.calendario) .tabela td:nth-child(3),
.tela-calendario .tabela th:nth-child(3),
.tela-calendario .tabela td:nth-child(3) { width: 28%; }
.tela-index .corpo:has(.calendario) .tabela th:nth-child(4),
.tela-index .corpo:has(.calendario) .tabela td:nth-child(4),
.tela-calendario .tabela th:nth-child(4),
.tela-calendario .tabela td:nth-child(4) { width: 21%; }
.tela-index .corpo:has(.calendario) .tabela th,
.tela-index .corpo:has(.calendario) .tabela td,
.tela-calendario .tabela th,
.tela-calendario .tabela td { white-space: normal; word-break: break-word; padding: 6px 5px; text-align: left; }

/* a relacao do mes nao tem largura minima de 720, 11/09/2026 */
.tela-index .corpo:has(.calendario) .tabela,
.tela-calendario .tabela { min-width: 0; }
.tela-index .corpo:has(.calendario) .rolagem,
.tela-calendario .rolagem { min-width: 0; width: 100%; overflow-x: hidden; }
.tela-index .corpo:has(.calendario) .cartao,
.tela-calendario .cartao { min-width: 0; }

/* relacao do mes: texto inteiro, sem quebrar palavra, 11/09/2026 */
.tela-index .corpo:has(.calendario) .tabela th,
.tela-index .corpo:has(.calendario) .tabela td,
.tela-calendario .tabela th,
.tela-calendario .tabela td { word-break: normal; overflow-wrap: break-word; hyphens: none; }
.tela-index .corpo:has(.calendario) .tabela th:nth-child(1),
.tela-index .corpo:has(.calendario) .tabela td:nth-child(1),
.tela-calendario .tabela th:nth-child(1),
.tela-calendario .tabela td:nth-child(1) { width: 9%; }
.tela-index .corpo:has(.calendario) .tabela th:nth-child(2),
.tela-index .corpo:has(.calendario) .tabela td:nth-child(2),
.tela-calendario .tabela th:nth-child(2),
.tela-calendario .tabela td:nth-child(2) { width: 34%; }
.tela-index .corpo:has(.calendario) .tabela th:nth-child(3),
.tela-index .corpo:has(.calendario) .tabela td:nth-child(3),
.tela-calendario .tabela th:nth-child(3),
.tela-calendario .tabela td:nth-child(3) { width: 22%; }
.tela-index .corpo:has(.calendario) .tabela th:nth-child(4),
.tela-index .corpo:has(.calendario) .tabela td:nth-child(4),
.tela-calendario .tabela th:nth-child(4),
.tela-calendario .tabela td:nth-child(4) { width: 35%; }
.tela-index .corpo:has(.calendario) .tabela,
.tela-calendario .tabela { font-size: 12px; }

/* na tela do calendario nenhum quadro entra em colunas, 11/09/2026 */
.tela-index .corpo:has(.calendario) .cartao { column-count: initial; column-gap: normal; max-height: none; overflow: visible; }
.tela-tudo .paginacao { margin-top: 8px; }
.tela-tudo .cartao .item { padding: 7px 10px; }
.tela-tudo .cartao .item { padding: 5px 10px; margin: 0 0 5px; }
.tela-tudo .abas { margin-bottom: 4px; }
.tela-tudo .cartao { padding: 12px 14px; }

/* PADRAO UNICO DE MEDIDA DO METAS AGsB, 12/09/2026 */
.abas .botao-pequeno, .atalhos .botao-pequeno { min-width: 150px; height: 38px; display: inline-flex; align-items: center; justify-content: center; padding: 0 16px; font-size: 13px; }
.menu a { min-height: 38px; display: flex; align-items: center; justify-content: center; }
input[type=text], input[type=password], input[type=number], input[type=date], input[type=month], input[type=email], select { height: 38px; padding: 0 10px; margin: 0 0 12px; }
.filtro input, .filtro select, .busca-lista input, .par-data input, .retirar input[type=text], .retirar select { margin: 0; }
a.botao-voltar { height: 38px; display: inline-flex; align-items: center; padding: 0 22px; }
.tabela td.acoes button, .tabela td.acoes .botao-pequeno, .acao-linha button { height: 34px; min-width: 110px; display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; }
.paginacao .botao-pequeno { min-width: 44px; height: 38px; display: inline-flex; align-items: center; justify-content: center; padding: 0 12px; }
.ordem-empresas .botao-pequeno { height: 28px; min-width: 96px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; }

/* ABA E ATALHO: TODOS COM A MESMA LARGURA, 12/09/2026 */
.abas, .atalhos { display: flex; flex-wrap: nowrap; gap: 8px; width: 100%; }
.abas .botao-pequeno, .atalhos .botao-pequeno { flex: 1 1 0; min-width: 0; width: auto; text-align: center; }

/* MESMO RESPIRO ENTRE VOLTAR, ABAS E CARTOES, 12/09/2026 */
.voltar { margin: 0 0 14px; }
.abas, .atalhos { margin: 0 0 14px; }
.corpo > .abas:first-of-type { margin-top: 0; }
/* META, ABA EMPRESAS: SEM ROLAGEM POR DENTRO E CAIXAS ALINHADAS, 12/09/2026 */
.tela-meta .corpo > .cartao:has(.lista-marcar) { grid-column: 1 / -1; }
.tela-meta .cartao { max-height: none; overflow-y: visible; }
.lista-marcar { max-height: none; overflow-y: visible; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 2px 18px; padding: 8px 10px; }
.tela-meta .lista-marcar { max-height: none; }
.lista-marcar .marca { display: grid; grid-template-columns: 18px 1fr; align-items: center; gap: 8px; text-align: left; height: 30px; margin: 0; }
.lista-marcar .marca input { width: 16px; height: 16px; margin: 0; }
/* META, ABA EMPRESAS: OS DOIS BLOCOS LADO A LADO, TELA SEM ROLAR, 12/09/2026 */
.tela-meta .corpo > .cartao:has(.lista-marcar) { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; align-items: start; }
.tela-meta .corpo > .cartao:has(.lista-marcar) > h2:nth-of-type(1) { grid-column: 1; grid-row: 1; }
.tela-meta .corpo > .cartao:has(.lista-marcar) > form:nth-of-type(1) { grid-column: 1; grid-row: 2; }
.tela-meta .corpo > .cartao:has(.lista-marcar) > h2:nth-of-type(2) { grid-column: 2; grid-row: 1; }
.tela-meta .corpo > .cartao:has(.lista-marcar) > form:nth-of-type(2) { grid-column: 2; grid-row: 2; }
.tela-meta .corpo > .cartao:has(.lista-marcar) > script { display: none; }
.tela-meta .lista-marcar { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.tela-meta .lista-marcar .marca { height: 26px; font-size: 13px; }
.tela-meta .autoria { padding: 4px 18px 10px; }
/* META: A TELA INTEIRA SEM ROLAR, 12/09/2026 */
.tela-meta .lista-marcar { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); padding: 6px 8px; }
.tela-meta .lista-marcar .marca { height: 24px; }
.tela-meta .cartao { padding: 14px; }
.tela-meta .corpo { gap: 10px; }
.tela-meta .cartao h2 { margin: 0 0 8px; }
.tela-meta .cartao form { margin-top: 8px; }
.tela-meta .autoria { padding: 2px 18px 8px; }
/* META: MAIS LARGURA PARA A LISTA DE EMPRESAS, MENOS ALTURA, 12/09/2026 */
.tela-meta .corpo > .cartao:has(.lista-marcar) { grid-template-columns: 0.85fr 1.15fr; }
.tela-meta .lista-marcar { grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: 0 14px; }
.tela-meta .lista-marcar .marca { height: 23px; font-size: 12.5px; }
/* META: SEM VAO ENTRE OS CARTOES DA COLUNA DA ESQUERDA, 12/09/2026 */
.tela-meta .corpo { grid-auto-rows: min-content; }
.tela-meta .corpo > .cartao:has(#situacao) { grid-row: span 2; }
.tela-meta .corpo > .cartao:has(#titulo) { grid-row: span 2; }
.tela-meta .corpo > .cartao:has(#arquivos) { grid-row: span 2; }
/* LISTA DE EMPRESAS NO PADRAO DA TABELA DE CLIENTES, 12/09/2026 */
.lista-marcar { border: 0; background: transparent; border-radius: 0; padding: 0; margin: 6px 0 12px; }
.lista-marcar .marca { border-bottom: 1px solid #EFECE2; padding: 0 2px; }
.tela-meta .lista-marcar { gap: 0 24px; }
/* META: O CARTAO DA META OCUPA A LARGURA INTEIRA, IGUAL AS ABAS, 12/09/2026 */
.tela-meta .corpo > .cartao:has(> .etiqueta) { grid-column: 1 / -1; }
.tela-meta .cartao { padding: 12px 14px; }
.tela-meta .lista-marcar .marca { height: 22px; }
/* META: ULTIMO AJUSTE PARA A TELA CABER INTEIRA, 12/09/2026 */
.tela-meta .corpo { padding: 10px 18px 6px; }
.tela-meta .abas { margin-bottom: 10px; }
.tela-meta .autoria { padding: 0 18px 6px; }
/* VOLTAR NO MESMO TAMANHO E NA MESMA DISTANCIA EM TODA TELA, 12/09/2026 */
.voltar { display: flex; margin: 0 0 10px; }
a.botao-voltar { width: 200px; height: 38px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.abas, .atalhos { margin: 0 0 10px; }
.tela-meta .abas { margin-bottom: 10px; }
.tela-meta .voltar, .tela-meta .abas { margin-bottom: 0; }
.tela-meta .corpo { padding: 18px 18px 6px; }
/* COMO USAR: AULAS EM DUAS COLUNAS QUE FLUEM, SEM BURACO, 12/09/2026 */
.lista-aulas { display: block; column-count: 2; column-gap: 14px; max-height: none; overflow: visible; }
.lista-aulas > * { break-inside: avoid; -webkit-column-break-inside: avoid; page-break-inside: avoid; margin: 0 0 14px; display: block; width: 100%; }
/* COMO USAR: CORRIGINDO, GRADE DE DUAS COLUNAS E A AULA ABERTA OCUPA A LINHA INTEIRA, 12/09/2026 */
.lista-aulas { display: grid; column-count: auto; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; grid-auto-rows: min-content; max-height: none; overflow: visible; }
.lista-aulas > * { margin: 0; width: auto; break-inside: auto; }
.lista-aulas > details[open] { grid-column: 1 / -1; }
/* COMO USAR: NADA DE ROLAGEM POR DENTRO, 12/09/2026 */
.lista-cards { max-height: none; overflow: visible; }
.lista-cards .cartao, .lista-aulas .cartao { padding: 12px 14px; }
.lista-cards .card-figura { width: 76px; height: 76px; flex: 0 0 76px; }
.lista-cards .cartao p { margin: 0; }
/* MESMO VAO DE 16 DEPOIS DO VOLTAR E DEPOIS DAS ABAS, EM TODA TELA, 12/09/2026 */
.corpo > .voltar { margin: 0 0 16px; }
.corpo > .abas, .corpo > .atalhos { margin: 0 0 16px; }
.painel-topo, .painel-grade, .corpo > .cartao:first-of-type { margin-top: 0; }
.tela-meta .corpo > .voltar, .tela-meta .corpo > .abas { margin-bottom: 6px; }
/* CALENDARIO: OS DOIS CARTOES COM A MESMA LARGURA E A MESMA ALTURA, 12/09/2026 */
@media (min-width: 981px) { .corpo:has(.calendario) { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: stretch; } }
.corpo:has(.calendario) > .voltar, .corpo:has(.calendario) > .abas { grid-column: 1 / -1; margin: 0; }
.corpo:has(.calendario) > .cartao { margin: 0; }
@media (min-width: 981px) { body.tela-index .corpo:has(.calendario) { grid-template-columns: 1fr 1fr !important; gap: 16px !important; align-items: stretch !important; } }
body.tela-index .corpo:has(.calendario) > .cartao { margin: 0 !important; }
/* CALENDARIO: NOME DA META INTEIRO, NADA CORTADO, 12/09/2026 */
.cal-item { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.25; font-size: 10px; padding: 3px 5px; font-weight: 700; }
.cal-dia { min-height: 76px; }
/* CALENDARIO: TODA CAIXA DE DIA COM A MESMA ALTURA, 12/09/2026 */
.cal-dia { height: 60px; min-height: 60px; }
.cal-vazio { height: 60px; min-height: 60px; }
/* CALENDARIO: A TELA INTEIRA SEM ROLAR, 12/09/2026 */
.cal-dia, .cal-vazio { height: 50px; min-height: 50px; padding: 3px 4px; }
.cal-item { font-size: 9px; line-height: 1.2; padding: 2px 4px; }
.cal-numero { font-size: 11px; }
body.tela-index .corpo:has(.calendario) > .cartao { padding: 12px 14px; }
body.tela-index .corpo:has(.calendario) > .voltar, body.tela-index .corpo:has(.calendario) > .abas { margin: 0 !important; }
/* SCRIPT NAO OCUPA LINHA NA GRADE, 13/09/2026 */
.corpo > script, .cartao > script, .lista-aulas > script { display: none; }
/* A FAIXA DO VOLTAR E A DAS ABAS TEM A ALTURA DO BOTAO, 13/09/2026 */
.corpo > .voltar, .corpo > .abas, .corpo > .atalhos { padding: 0; height: 38px; align-items: center; }
@media (min-width: 981px) { body.tela-index .corpo:has(.calendario) { grid-template-rows: 38px 38px auto !important; } }
/* CALENDARIO: TODA META COM O MESMO REALCE, 13/09/2026 */
.cal-item, .cal-item * { font-weight: 700 !important; font-size: 10px !important; line-height: 1.2 !important; color: #FFFFFF !important; }
.cal-dia, .cal-vazio { height: 56px; min-height: 56px; }
/* TELA DA EMPRESA NA META: CARTAO DE CIMA NA LARGURA INTEIRA E BOTAO EM UMA LINHA, 13/09/2026 */
.tela-entrega .corpo > .cartao:has(> .etiqueta) { grid-column: 1 / -1; }
.tela-entrega .atalhos .botao-pequeno, .tela-entrega .atalhos form { white-space: nowrap; }
.tela-entrega .cartao { padding: 12px 14px; }
.tela-entrega .corpo { padding: 18px 18px 6px; gap: 10px; }
.tela-entrega .cartao h2 { margin: 0 0 8px; }
.tela-entrega .cartao form { margin-top: 8px; }
.tela-entrega .tabela td, .tela-entrega .tabela th { padding: 5px 8px; }
.tela-entrega .autoria { padding: 2px 18px 8px; }
.tela-entrega .cartao p.item-info { margin: 0 0 6px; }
/* TELA DA EMPRESA NA META: CARTOES DA MESMA LINHA COM A MESMA ALTURA, SEM BURACO, 13/09/2026 */
.tela-entrega .corpo { align-items: stretch; }
.tela-entrega .corpo > .cartao { align-self: stretch; margin: 0; }
/* RODAPE IDENTICO AO DO PAINEL EM TODA TELA, 13/09/2026 */
.autoria { padding-top: 2px; padding-bottom: 2px; }
/* CELULAR: LOGO MENOR E RODAPE CONGELADO NA BASE, 13/09/2026 */
@media (max-width: 560px) {
.autoria { position: fixed; left: 0; right: 0; bottom: 0; background: #F2EFE6; z-index: 50; padding: 4px 12px; box-shadow: 0 -2px 8px rgba(0,0,0,.08); }
.autoria .selo { width: 56px; height: 48px; margin-bottom: 4px; }
body { padding-bottom: 176px; }
}

/* CELULAR: TOPO, FAIXA E MENU CONGELADOS, 13/09/2026 */
@media (max-width: 560px) {
.topo { position: fixed; top: 0; left: 0; right: 0; z-index: 60; }
.faixa { position: fixed; top: 54px; left: 0; right: 0; z-index: 60; }
.menu { position: fixed; top: 58px; left: 0; right: 0; z-index: 59; background: #F2EFE6; }
body { padding-top: 205px; }
}

/* CELULAR: VOLTAR NO TAMANHO DA ABA E VAO DE 16 EM TODA TELA, 13/09/2026 */
@media (max-width: 560px) {
a.botao-voltar { width: 112px; height: 32px; font-size: 13px; }
.corpo > .voltar { height: 32px; margin: 0 0 16px; }
body.tela-index .corpo:has(.calendario) > .voltar { margin: 0 0 16px; }
}

/* CELULAR: FAIXA DA EMPRESA CONGELADA E VAO DO CALENDARIO EM 16, 13/09/2026 */
@media (max-width: 560px) {
.troca-empresa { position: fixed; top: 199px; left: 0; right: 0; z-index: 58; background: #F2EFE6; }
body:has(.troca-empresa) { padding-top: 245px; }
body.tela-index .corpo:has(.calendario) > .voltar { margin: 0 0 16px !important; }
}

/* CELULAR: FAIXA OPACA NO TOPO E FIM DA ROLAGEM POR DENTRO, 13/09/2026 */
@media (max-width: 560px) {
body::before { content: ""; position: fixed; top: 0; left: 0; right: 0; height: 205px; background: #F2EFE6; z-index: 57; }
.topo { z-index: 62; }
.faixa { z-index: 62; }
.menu { z-index: 61; }
.troca-empresa { z-index: 60; }
.lista-aulas { max-height: none; overflow: visible; }
.cartao { overflow-y: visible; }
}

/* CELULAR: UMA UNICA ROLAGEM, A DA PAGINA, 13/09/2026 */
@media (max-width: 560px) {
body { overflow: visible; height: auto; }
body.tela-ajuda .lista-aulas, .tela-ajuda .lista-aulas, .lista-aulas { max-height: none; overflow: visible; }
body .cartao { overflow: visible; }
}

/* CELULAR: VOLTAR E BOTOES DE MES NO MESMO PADRAO, 13/09/2026 */
@media (max-width: 560px) {
a.botao-voltar { width: auto; height: auto; padding: 5px 12px; font-size: 13px; border-radius: 8px; }
.corpo > .voltar { height: auto; margin: 0 0 6px; }
.periodo { display: flex; gap: 8px; margin: 0 0 12px; }
.periodo .botao-pequeno { flex: 1 1 0; min-width: 0; height: 29px; padding: 0 6px; font-size: 12px; }
.topo a { font-size: 14px; padding: 14px 8px; }
}

/* CELULAR: TODOS OS VAOS DO CALENDARIO EM 16, 13/09/2026 */
@media (max-width: 560px) {
body.tela-index .corpo:has(.calendario) { gap: 16px; }
body.tela-index .corpo:has(.calendario) > .voltar { margin: 0; }
body.tela-index .corpo:has(.calendario) > .voltar { margin: 0; }
body.tela-index .corpo:has(.calendario) > .abas { margin: 0; }
body.tela-index .corpo:has(.calendario) > .cartao { margin: 0; }
}

/* BOTOES DE MES NO PADRAO DOS BOTOES DE EMPRESA, 13/09/2026 */
.periodo .botao-pequeno, .periodo a.botao-pequeno, .periodo button.botao-pequeno { background: #FFFFFF; color: #003C52; border: 1px solid #C9C2B0; border-radius: 8px; font-weight: 600; }
.periodo .botao-pequeno.ativo { background: #003C52; border-color: #003C52; color: #FFFFFF; font-weight: 700; }
.corpo .periodo a.botao-pequeno, .corpo .periodo a.botao-pequeno:visited { color: #003C52; }
.corpo .periodo a.botao-pequeno.ativo, .corpo .periodo a.botao-pequeno.ativo:visited { color: #FFFFFF; }
/* VAO UNICO DE 16 ENTRE OS BLOCOS DO CORPO, CELULAR E COMPUTADOR, 13/09/2026 */
.corpo > .voltar, .corpo > .abas, .corpo > .atalhos, .corpo > .cartao, .corpo > .painel-topo, .corpo > .painel-grade, .corpo > .lista-aulas, .corpo > .lista-cards, .corpo > a.botao, .corpo > .ok, .corpo > .erro { margin: 0 0 16px !important; }
.corpo > *:last-child { margin-bottom: 0 !important; }
body.tela-calendario .corpo, body.tela-meta .corpo, body.tela-entrega .corpo, body.tela-index .corpo:has(.calendario) { row-gap: 16px !important; column-gap: 16px !important; grid-auto-rows: min-content !important; }

body.tela-calendario .corpo > *, body.tela-meta .corpo > *, body.tela-entrega .corpo > *, body.tela-index .corpo:has(.calendario) > * { margin: 0 !important; }
/* CELULAR: A TABELA DE METAS DA AREA DO CLIENTE VIRA LISTA, SEM QUEBRA DE PALAVRA, 13/09/2026 */
@media (max-width: 560px) {
body.tela-solicitar .tabela, body.tela-solicitar .tabela tbody, body.tela-solicitar .tabela tr, body.tela-solicitar .tabela td { display: block; width: auto; }
body.tela-solicitar .tabela tr:first-child { display: none; }
body.tela-solicitar .tabela tr { border: 1px solid #E3DFD3; border-radius: 8px; background: #FFFFFF; padding: 8px 10px; margin: 0 0 10px; }
body.tela-solicitar .tabela td { border: 0; padding: 3px 0; display: flex; justify-content: space-between; align-items: center; gap: 12px; text-align: right; font-size: 13px; }
body.tela-solicitar .tabela td::before { font-weight: 700; color: #003C52; text-align: left; white-space: nowrap; }
body.tela-solicitar .tabela td:first-child { display: block; text-align: left; font-weight: 700; color: #003C52; font-size: 14px; border-bottom: 1px solid #EDE9DC; padding-bottom: 6px; margin-bottom: 4px; }
body.tela-solicitar .tabela td:nth-child(2)::before { content: "Competência"; }
body.tela-solicitar .tabela td:nth-child(3)::before { content: "Vence"; }
body.tela-solicitar .tabela td:nth-child(4)::before { content: "Situação"; }
body.tela-solicitar .tabela td:nth-child(5)::before { content: "Documento"; }
}
/* CELULAR: A TECLA SAIR NO TAMANHO DE TECLA, NO PADRAO DAS DEMAIS, 13/09/2026 */
@media (max-width: 560px) {
.topo .topo-acoes a { display: inline-flex; align-items: center; justify-content: center; min-width: 74px; height: 32px; padding: 0 16px; font-size: 14px; font-weight: 700; line-height: 1; color: #FFFFFF; border: 1px solid rgba(255,255,255,0.55); border-radius: 8px; }

}
/* RODAPE: VAO FIXO DE 107 PX ENTRE O FIM DO CONTEUDO E O TOPO DO LOGO, 14/09/2026 */
body { min-height: 0; display: block; }
.corpo { flex: none; padding-bottom: 0; }
.corpo > *:last-child { margin-bottom: 0; }
.autoria { flex: none; margin-top: auto; padding-top: 0; }

body.tela-painel .autoria, body.tela-meta .autoria, body.tela-entrega .autoria { margin-top: auto; padding-top: 0; }

/* 14/09/2026 quadros de contato centralizados e da mesma altura */
.contatos .contato-item { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; min-height: 64px; }
.contatos .contato-rotulo { text-align: center; }
.contatos .contato-valor { text-align: center; }

/* 14/09/2026 razao social em destaque na tela EMPRESA */
.valor-destaque { display: inline-block; padding: 6px 12px; border-radius: 8px; border: 1px solid #E3DFD3; background: #FFFFFF; font-size: 16px; font-weight: 700; color: #003C52; cursor: pointer; outline: none; }
.valor-destaque:focus, .valor-destaque:active { background: #003C52; border-color: #003C52; color: #FFFFFF; }

/* 14/09/2026 parte 1 da Area do cliente */
.cadastro-fechado { border: 0; }
.cadastro-fechado > summary { list-style: none; cursor: pointer; padding: 2px 0; }
.cadastro-fechado > summary::-webkit-details-marker { display: none; }
.cadastro-fechado > summary::marker { content: ''; }
.cadastro-fechado > summary .valor-destaque { font-size: 17px; }
.cadastro-fechado[open] > summary .valor-destaque { background: #003C52; border-color: #003C52; color: #FFFFFF; }
.doc-nome { display: inline-block; margin-left: 10px; font-weight: 600; color: #003C52; }

/* 14/09/2026 botoes do calendario em caixa alta e centralizados */
.periodo { justify-content: center; }
.periodo .botao-pequeno { text-transform: uppercase; letter-spacing: 0.4px; display: inline-flex; align-items: center; justify-content: center; text-align: center; }

/* 14/09/2026 fim da rolagem por dentro dos cartoes: a tela rola inteira */
.tela-nova .cartao, .tela-termo .cartao, .tela-index .cartao,
.tela-meta .cartao, .tela-clientes .cartao,
.tela-calendario .cartao .rolagem,
.tela-index .corpo:has(.calendario) .rolagem { max-height: none; overflow-y: visible; }
.tela-calendario .cartao .rolagem, .tela-index .corpo:has(.calendario) .rolagem { overflow-x: auto; }

/* 14/09/2026 niveis de urgencia em blocos separados */
.rotulo-urgencia { display: block; font-size: 12px; font-weight: 700; letter-spacing: 0.4px; color: #003C52; margin: 0 0 8px; }
.niveis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.nivel { display: block; min-width: 0; margin: 0; cursor: pointer; }
.nivel input { position: absolute; opacity: 0; width: 0; height: 0; }
.nivel-caixa { display: flex; width: 100%; box-sizing: border-box; align-items: center; justify-content: center; height: 38px; padding: 0 8px; border: 1px solid #D9D4C6; border-radius: 8px; background: #FFFFFF; text-align: center; }
.nivel-nome { font-size: 13px; font-weight: 700; color: #003C52; letter-spacing: 0.3px; }
.nivel-prazo { font-size: 11px; color: #5A5A5A; }
.nivel input:checked + .nivel-caixa { background: #003C52; border-color: #003C52; }
.nivel input:checked + .nivel-caixa .nivel-nome { color: #FFFFFF; }
.nivel input:focus + .nivel-caixa { border-color: #A68B4D; }
@media (max-width: 560px) { .niveis { grid-template-columns: repeat(3, 1fr); } }


/* PADRAO DE MEDIDA DAS TELAS, 16/09/2026 */
a.botao:not(.botao-pequeno),
.cartao button,
.cartao .botao,
.cartao input[type=submit],
.cartao button[type=submit] {
  height: 38px !important;
  min-height: 38px !important;
  padding-top: 0;
  padding-bottom: 0;
  line-height: 38px;
  box-sizing: border-box;
}
.cartao .botao-pequeno,
.cartao table button,
.cartao table .botao,
.cartao table a.botao-pequeno,
.cartao td button,
.cartao td .botao {
  height: 31px !important;
  min-height: 31px !important;
  box-sizing: border-box;
  line-height: 1;
}
.cartao input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=submit]),
.cartao select {
  height: 38px;
  box-sizing: border-box;
}
.cartao textarea {
  min-height: 38px;
  box-sizing: border-box;
}

/* TOPO SEMPRE A VISTA E RODAPE ENXUTO, 16/09/2026 */
.topo {
  position: sticky;
  top: 0;
  z-index: 60;
}
.faixa {
  position: sticky;
  top: 58px;
  z-index: 60;
}
.menu {
  position: sticky;
  top: 62px;
  z-index: 59;
  background: #F7F5EF;
}
.autoria {
  margin-top: 6px;
  padding-top: 12px;
}
.autoria .selo {
  height: 67px;
  width: 67px;
}

/* TOPO PRESO NO ALTO, 16/09/2026 */
body { padding-top: 110px; }
.topo { position: fixed; top: 0; left: 0; right: 0; z-index: 60; }
.faixa { position: fixed; top: 58px; left: 0; right: 0; z-index: 61; }
.menu { position: fixed; top: 58px; left: 0; right: 0; z-index: 59; background: #F7F5EF; padding-top: 8px; }

/* PAINEL COUBE NA TELA, 16/09/2026 */
.painel-topo { margin-bottom: 8px; }
.painel-grade { gap: 12px; }

/* CAIXA ALTA EM BOTAO E ABA, ORDEM DELA 17/09/2026 */
.menu a,
.menu button,
.cartao button,
.cartao .botao,
a.botao,
.botao-pequeno,
.voltar a,
.abas a,
.abas button {
  text-transform: uppercase;
}

/* CALENDARIO, TABELA DA DIREITA, 17/09/2026 */
body.tela-index .rolagem table.tabela { table-layout: auto; width: 100%; }
body.tela-index .rolagem table.tabela th:last-child,
body.tela-index .rolagem table.tabela td:last-child { white-space: nowrap; }

/* CABECALHO DE TABELA SEM GRUDAR, 17/09/2026 */
.tabela th { white-space: nowrap; padding-right: 24px; }


/* ATALHOS DE VENCIMENTO EM UMA LINHA SO, 17/09/2026 */
.atalhos a { white-space: nowrap; }


/* RODAPE PRESO EMBAIXO EM TODAS AS TELAS, 17/09/2026 */
body { display: flex; flex-direction: column; min-height: 100vh; }
.autoria { margin-top: auto; }


/* Configuracao do escritorio */
.grade-campos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 22px}
.campo{display:flex;flex-direction:column;gap:5px}
.campo label{font-weight:700;color:#003C52;font-size:14px}
.campo input[type=text]{height:38px;padding:6px 10px;border:1px solid #cfcfcf;border-radius:6px;font-size:14px;width:100%;box-sizing:border-box}
.campo .item-info{font-size:12.5px;color:#666;margin:0}
.escolha-tipo{display:flex;gap:34px;flex-wrap:wrap}
.escolha-tipo .marca{font-size:15px;font-weight:600;color:#003C52}
.botao-arquivo{display:inline-block;height:38px;line-height:24px;padding:6px 16px;border:1px solid #A68B4D;border-radius:6px;background:#F2EFE6;color:#003C52;font-size:14px;font-weight:600;cursor:pointer;width:max-content}
.arquivo-oculto{position:absolute;left:-9999px;top:0;width:1px;height:1px;opacity:0;pointer-events:none}
@media (max-width:900px){.grade-campos{grid-template-columns:1fr}}


/* logo do rodape vem da configuracao do escritorio */
.selo{background-image:none !important;display:none !important}
.selo-logo{display:block;margin:0 auto 6px;max-height:46px;width:auto}

/* PADRAO SAGAX, CANTO RETO E LOGO DESLIGADA, 19/09/2026 */
*,*::before,*::after{border-radius:0 !important}
.autoria .selo{background-image:none !important;display:none !important}

/* VERSAO ESCRITORIO, SEM MASCOTE, 19/09/2026 */
img[src*="ag-"],img[src*="agsbinho"],img[src*="AGSBINHO"],img[src*="AGsBinho"],img[alt*="AGsBinho"]{display:none !important}

/* RELATORIOS NO PADRAO 24-09-2026: filtros alinhados, tabela sem corte, formato embaixo, pagina sem rolar */
body.tela-relatorios .periodo{justify-content:flex-start !important}
body.tela-relatorios form.filtro{display:flex !important;align-items:flex-end !important;gap:10px !important;flex-wrap:nowrap !important}
body.tela-relatorios form.filtro > div{display:flex !important;flex-direction:column !important;margin:0 !important}
body.tela-relatorios form.filtro input:not([type=hidden]),body.tela-relatorios form.filtro select{width:196px !important;margin:0 !important}
body.tela-relatorios form.filtro button{margin:0 !important;width:180px !important}
body.tela-relatorios .rolagem{overflow-y:auto !important;overflow-x:hidden !important;max-height:calc(100vh - 600px) !important}
body.tela-relatorios .rolagem .tabela{table-layout:fixed !important;width:100% !important}
body.tela-relatorios .rolagem .tabela th,body.tela-relatorios .rolagem .tabela td{white-space:normal !important;text-overflow:clip !important;overflow:visible !important;word-break:normal !important;overflow-wrap:normal !important;max-width:none !important;padding-left:6px !important;padding-right:6px !important;text-align:left !important;hyphens:none}
body.tela-relatorios .rolagem .tabela th{font-size:11px !important;vertical-align:bottom;position:sticky;top:0;background:#fff;z-index:1}
body.tela-relatorios .rolagem .tabela td{font-size:13px}
body.tela-relatorios .rolagem .tabela td{overflow-wrap:anywhere !important}
body.tela-relatorios .cartao:has(.rolagem){display:flex !important;flex-direction:column !important}
body.tela-relatorios .cartao:has(.rolagem) > .periodo.nao-imprime{order:9;margin-top:16px !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(1){width:9% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(2){width:10% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(3){width:6% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(4){width:7% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(5){width:7% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(6){width:7% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(7){width:12% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(8){width:4% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(9){width:7% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(10){width:7% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(11){width:7% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(12){width:6% !important}
body.tela-relatorios .rolagem .tabela:has(th:nth-child(13)) th:nth-child(13){width:11% !important}

/* RELATORIOS, DEMAIS MODALIDADES 24-09-2026: coluna final nao encolhe, linha sem quebra desnecessaria */
body.tela-relatorios .rolagem .tabela:not(:has(th:nth-child(13))){table-layout:auto !important}
body.tela-relatorios .rolagem .tabela:not(:has(th:nth-child(13))) th,body.tela-relatorios .rolagem .tabela:not(:has(th:nth-child(13))) td{width:auto !important}

/* CAMERA NO ENVIO DO CLIENTE 24-09-2026: os dois campos de arquivo dividem a linha, na medida de 38px */
body.tela-solicitar .campo:has(input[capture]){display:grid;grid-template-columns:1fr 1fr;column-gap:16px;align-items:end}
body.tela-solicitar .campo:has(input[capture]) label:nth-of-type(1){grid-column:1;grid-row:1}
body.tela-solicitar .campo:has(input[capture]) input[type=file]:not([capture]){grid-column:1;grid-row:2}
body.tela-solicitar .campo:has(input[capture]) label:nth-of-type(2){grid-column:2;grid-row:1}
body.tela-solicitar .campo:has(input[capture]) input[capture]{grid-column:2;grid-row:2}
body.tela-solicitar .campo input[type=file]{width:100%;box-sizing:border-box}

/* TELA DA GUIA 24-09-2026: os tres botoes na medida de 38px, largura igual, sem fugir do cartao */
body .cartao a.botao-secundario{display:block;height:38px;line-height:38px;text-align:center;width:100%;box-sizing:border-box;border:1px solid var(--azul);color:var(--azul);text-decoration:none;margin-top:8px}

/* GUIA NA PROPRIA TELA 24-09-2026: o documento aparece dentro do cartao, com rolagem so dele */
.guia-folha{max-height:calc(100vh - 720px);min-height:140px;overflow-y:auto;background:var(--off);padding:8px;margin:8px 0}
/* na tela da guia os dados ficam compactos, para o documento e os botoes caberem juntos */
.cartao:has(.guia-folha) .hist{margin:4px 0}
.cartao:has(.guia-folha) .rotulo-cadastro{display:inline-block;min-width:150px}
.guia-pagina{display:block;width:100%;height:auto;margin:0 auto 8px;background:#fff}

/* CODIGO PARA PAGAR NA TELA DA GUIA 24-09-2026 */
.pagar{background:#F2EFE6;border:1px solid #d9d2bf;padding:12px;margin:10px 0}
.pagar .rotulo-cadastro{display:block;margin-bottom:6px}
.pagar-num{display:block;font-family:Consolas,monospace;font-size:15px;color:#003C52;letter-spacing:.5px;line-height:1.6;word-break:break-word;margin-bottom:10px}
.pagar .botao{width:100%}
.pagar-dica{display:block;font-size:12px;color:#6b767d;margin-top:8px;line-height:1.5}

/* TELA DO DOCUMENTO EM DUAS COLUNAS NO COMPUTADOR 24-09-2026: dados e botoes a esquerda, documento a direita, sem rolar a pagina */
@media (min-width: 900px) {
  .cartao:has(.guia-folha){display:grid;grid-template-columns:1fr 1fr;column-gap:24px;align-items:start}
  .cartao:has(.guia-folha) > *{grid-column:1}
  .cartao:has(.guia-folha) > .guia-folha{grid-column:2;grid-row:1 / span 30;max-height:calc(100vh - 470px);margin:0}
}

/* TELA DO DOCUMENTO NO CELULAR 24-09-2026: cabe em uma tela, sem rolar a pagina */
@media (max-width: 899px) {
  .cartao:has(.guia-folha) .hist{margin:3px 0}
  .cartao:has(.guia-folha) .dado{font-size:14px;padding:3px 0}
  .cartao:has(.guia-folha) .dado .rotulo-cadastro{min-width:120px}
  .cartao:has(.guia-folha) .dado-extra{display:none}
  .cartao:has(.guia-folha) .pagar{padding:9px;margin:8px 0}
  .cartao:has(.guia-folha) .pagar-num{font-size:13px;margin-bottom:7px}
  .cartao:has(.guia-folha) .pagar-dica{font-size:11px;margin-top:5px}
  .cartao:has(.guia-folha) > .guia-folha{max-height:calc(100vh - 610px);min-height:170px}
  .cartao:has(.guia-folha) .valor-destaque{font-size:15px}
  .cartao:has(.guia-folha) > p.hist:first-child{margin:0 0 4px 0}
  .cartao:has(.guia-folha) .botao{margin-top:8px}
  .cartao:has(.guia-folha) .botao-secundario{margin-top:6px}
  .cartao:has(.guia-folha) #guia-recado:empty{display:none}
  body:has(.guia-folha) .autoria{font-size:9px;line-height:1.35;padding-top:8px}
}

/* AJUSTE FINO DA TELA DO DOCUMENTO NO CELULAR 24-09-2026 */
@media (max-width: 899px) {
  .cartao:has(.guia-folha){padding:12px}
  .cartao:has(.guia-folha) > p.hist:first-child{margin:0 0 6px 0;line-height:1.2}
  .cartao:has(.guia-folha) .dado{font-size:13px;padding:2px 0;margin:0;line-height:1.5}
  .cartao:has(.guia-folha) .pagar{padding:8px}
  .cartao:has(.guia-folha) .pagar-num{font-size:12px;line-height:1.5;margin-bottom:6px}
  .cartao:has(.guia-folha) .botao,
  .cartao:has(.guia-folha) .botao-secundario{height:38px;line-height:38px;padding:0;margin-top:7px}
  .cartao:has(.guia-folha) > p.hist:has(.botao),
  .cartao:has(.guia-folha) > p.hist:has(.botao-secundario){margin:0}
}

/* NO CELULAR A PAGINA NAO ROLA: quem rola e o cartao do documento 24-09-2026 */
@media (max-width: 899px) {
  body:has(.guia-folha) .cartao{max-height:calc(100vh - 370px);overflow-y:auto}
  body:has(.guia-folha) .voltar{margin-bottom:6px}
}