/* web/css/tsiroos-extra.css — o que o mockup não tem. Nunca sobrescrever regra do tsiroos.css aqui. */
.entrar{min-height:100vh;display:grid;place-items:center;padding:16px}
.entrar .card{width:min(380px,100%)}
.entrar label{display:grid;gap:4px;margin-top:12px}
.entrar .erro{color:#B42318;margin-top:10px;min-height:1.2em}
/* Fase 6 (6.15, L27): chips de nota que o mockup não tem. Só estes; o resto dos chips é do tsiroos.css (.doc.ok, .doc.pend). */
.doc.cons{background:var(--amber-soft);color:#6B4A07;border:1px solid #E8D29A}
.doc.rej{background:var(--red-soft);color:#7E241C;border:1px solid #E9B4AE;font:inherit;font-size:.74rem;cursor:pointer}
.doc.canc{color:var(--faint);border:1px solid var(--line2);text-decoration:line-through}
/* E2-gestao (GES-11): link com .btn sai igual ao <button class="btn"> (sem o azul e o sublinhado do <a>); .btn.pri e .btn.leaf continuam brancos */
a.btn{color:inherit;text-decoration:none}
a.btn.pri,a.btn.leaf{color:#fff}
/* B-comercial (COM-11): campo de formulário (.fgrid) com <select>/<input> de largura própria passava por cima do vizinho; item de grade tem min-width:auto, então a coluna minmax(0,1fr) não o encolhia */
.fgrid>*{min-width:0}
.fgrid .field input,.fgrid .field select,.fgrid .field textarea{min-width:0;max-width:100%;box-sizing:border-box}
/* Foto do trator (migração 017; mockup foto-trator-e-habilidades, abas 1 e 2). Prefixo ft-: nada aqui pega regra global. A foto entra no cartão
   .equip com margem negativa (o padding de 12 px do cartão continua): escondida, o cartão volta a ser o de antes. */
.equip.ft{overflow:hidden}
.equip.ft>.ft-foto{margin:-12px -12px 4px;max-width:none}
.ft-foto{aspect-ratio:4/3;max-width:100%;position:relative;background:var(--sunk);display:block;overflow:hidden}
.ft-foto img{width:100%;height:100%;object-fit:cover;display:block}
.ft-cam{position:absolute;right:8px;bottom:8px;background:rgba(23,33,28,.72);color:#fff;font-size:.72rem;padding:3px 8px;border-radius:999px}
.ft-sem{display:grid;place-items:center;height:100%;color:var(--faint);font-size:.82rem;text-align:center;padding:10px;border:2px dashed var(--line2);box-sizing:border-box}
.ft-ficha{display:grid;gap:16px;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:start}
@media (max-width:820px){.ft-ficha{grid-template-columns:1fr}}
.ft-gal .cb{display:grid;gap:8px}
.ft-grande{border-radius:10px;border:1px solid var(--line)}
.ft-minis{display:flex;gap:8px;flex-wrap:wrap}
.ft-m{all:unset;cursor:pointer;width:84px;border-radius:6px;overflow:hidden;border:2px solid transparent}
.ft-m.on{border-color:var(--leaf)}
.ft-m.ft-add{display:grid;place-items:center;aspect-ratio:4/3;border:2px dashed var(--line2);color:var(--muted);font-size:.75rem}
.ft-m:focus-visible{outline:2px solid var(--leaf);outline-offset:2px}
/* Árvore de habilidades (018): desenho do mockup aprovado foto-trator-e-habilidades.html (abas 4–6), classes com prefixo hb- (não colidem com .hb/.hbr das barras) */
.hb-cards{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));margin-bottom:14px}
.hb-card{border:1px solid var(--line);border-radius:10px;background:var(--sunk);display:grid}
.hb-card.on{background:var(--surface);border-color:var(--line2)}
.hb-card.sel{border-color:var(--leaf);box-shadow:0 0 0 2px var(--leaf-soft)}
.hb-abrir{all:unset;cursor:pointer;display:grid;gap:4px;padding:12px 12px 8px}
.hb-abrir:disabled{cursor:default;color:var(--faint)}
.hb-abrir:focus-visible{outline:2px solid var(--leaf);outline-offset:2px;border-radius:8px}
.hb-abrir b{font:650 .95rem var(--f-display)}
.hb-abrir small{color:var(--muted);font-size:.76rem}
.hb-chk{display:flex;gap:6px;align-items:center;font-size:.78rem;color:var(--muted);padding:6px 12px 10px;border-top:1px solid var(--line);cursor:pointer}
.hb-nvl{display:inline-flex;gap:3px}
.hb-nvl i{width:18px;height:6px;border-radius:3px;background:var(--line)}
.hb-nvl i.f{background:var(--leaf)}
.hb-leg{display:flex;gap:12px;flex-wrap:wrap;font-size:.76rem;color:var(--muted)}
.hb-leg span{display:inline-flex;gap:5px;align-items:center}
.hb-lg{width:12px;height:12px;border-radius:3px;display:inline-block;border:2px solid var(--line2)}
.hb-lg.feito{background:var(--leaf);border-color:var(--leaf)} .hb-lg.pode{background:var(--amber-soft);border-color:var(--amber)} .hb-lg.bloq{background:var(--sunk)}
.hb-arvore{position:relative;height:460px;min-width:0;overflow:hidden}
.hb-ligas{position:absolute;inset:0;width:100%;height:100%}
.hb-ligas line{stroke:var(--line2);stroke-width:2;stroke-dasharray:5 4}
.hb-ligas line.lok{stroke:var(--leaf);stroke-dasharray:none;stroke-width:3}
.hb-no{position:absolute;transform:translate(-50%,-50%);width:min(44%,230px);display:grid;gap:1px;text-align:left;padding:8px 10px;border-radius:10px;border:2px solid var(--line2);background:var(--sunk);color:var(--faint);font-size:.8rem}
.hb-no b{font:650 .88rem var(--f-display);color:inherit}
.hb-no .tier{font:500 .64rem var(--f-mono);letter-spacing:.06em;text-transform:uppercase}
.hb-no .d{font-size:.74rem}
.hb-no small{font-size:.72rem;margin-top:3px}
.hb-no.feito{background:var(--leaf-soft);border-color:var(--leaf);color:#24642A}
.hb-no.pode{background:var(--amber-soft);border-color:var(--amber);color:#6B4705;box-shadow:0 0 0 4px rgba(168,111,6,.12)}
.hb-no.pode .acao{font-weight:600;text-decoration:underline}
.hb-no.bloq{cursor:default}
.hb-no.novo{border-style:dashed;border-color:var(--blue)}
.hb-equipe{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));margin-bottom:14px}
.hb-eqp{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;font-size:.88rem}
.hb-reqs{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.84rem}
.hb-reqs label{display:inline-flex;gap:5px;align-items:center}
/* Biblioteca de manuais (multi-ramo F4, migração 024; mockup tsiroos-multi-ramo-e-manuais, abas 4 e 6). Prefixo mn-: nada aqui pega regra global. As classes são as do mockup (.bib .arv .doc .res .pag .cheia),
   só renomeadas, porque ".doc" já é o chip das notas fiscais. */
.mn-barra{gap:8px}
.mn-sel,.mn-busca{border:1px solid var(--line2);border-radius:6px;padding:7px 10px;background:var(--surface);min-width:0}
.mn-busca{flex:1;min-width:220px}
.mn-bib{display:grid;gap:16px;grid-template-columns:260px minmax(0,1fr);align-items:start}
@media (max-width:880px){.mn-bib{grid-template-columns:1fr}}
.mn-arv{display:grid;gap:2px;font-size:.88rem}
.mn-arv .fab{font:650 .78rem var(--f-mono);text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:10px 8px 4px}
.mn-arv button{all:unset;cursor:pointer;display:flex;justify-content:space-between;gap:8px;padding:7px 10px;border-radius:6px}
.mn-arv button:hover{background:var(--sunk)}
.mn-arv button.on{background:var(--brand-soft);color:var(--brand);font-weight:600}
.mn-arv button:focus-visible{outline:2px solid var(--leaf)}
.mn-docs{display:grid;gap:8px}
.mn-doc{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.mn-doc-c{grid-template-columns:minmax(0,1fr) auto}
.mn-doc .ico{width:40px;height:48px;border-radius:4px;background:var(--red-soft);color:var(--red);font:700 .66rem var(--f-mono);display:grid;place-items:center}
.mn-doc .ico.lk{background:var(--blue-soft);color:var(--blue)}
.mn-doc b{font-weight:600}
.mn-doc small{display:block;color:var(--muted);font-size:.78rem}
.mn-doc .acs{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-end}
@media (max-width:560px){.mn-doc{grid-template-columns:40px minmax(0,1fr)}.mn-doc-c{grid-template-columns:minmax(0,1fr)}.mn-doc .acs{grid-column:1/-1;justify-content:flex-start}}
.mn-res{display:grid;gap:8px}
.mn-res button{all:unset;cursor:pointer;display:grid;gap:2px;border:1px solid var(--line);border-left:4px solid var(--amber);border-radius:6px;padding:8px 12px;font-size:.86rem}
.mn-res button:hover{border-color:var(--amber)}
.mn-res small{color:var(--muted);font-size:.76rem}
.mn-res mark,.mn-txt mark{background:#FBE7A8;color:inherit;border-radius:2px;padding:0 1px}
.mn-vnav{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.mn-pag{background:#fff;border:1px solid var(--line2);border-radius:4px;padding:18px 20px;font-size:.84rem;line-height:1.55;box-shadow:0 2px 8px rgba(23,33,28,.08);max-height:360px;overflow:auto}
.mn-txt{white-space:pre-wrap;overflow-wrap:anywhere}
.mn-orig canvas{display:block;max-width:100%;background:#fff}
.mn-cheia{position:fixed;inset:0;z-index:20;background:rgba(16,24,20,.55);padding:20px;display:grid;place-items:center}
.mn-cheia>.card{width:min(100%,860px)}
.mn-cheia .mn-pag{max-height:calc(100vh - 160px)}
.mn-ck{display:flex;gap:8px;align-items:center}
.mn-ck input{width:17px;height:17px;accent-color:var(--brand)}
.mn-seg{display:inline-flex;gap:4px;flex-wrap:wrap}
/* Mapa de peças do modelo (multi-ramo F5, migração 026; mockup aba 5). Prefixo mn-. */
.mn-mapa td{vertical-align:top}
.mn-mapa .acs{display:flex;flex-wrap:wrap;gap:4px}
.mn-rem{opacity:.55}
.mn-eq{display:inline-flex;gap:4px;align-items:center;margin:0 4px 4px 0}
.mn-x{all:unset;cursor:pointer;padding:0 2px;font-weight:700;line-height:1}
.mn-x:focus-visible{outline:2px solid var(--leaf)}
/* T-10 (mockup "Fechar O.S. no financeiro", 03/11): no celular a janela de fechar o valor é mais alta que a tela; Cancelar/Salvar ficam grudados embaixo. Só nesta janela. */
@media (max-width:600px){.modal:has(#ffFecharConta)>.cf{position:sticky;bottom:-30px;background:var(--surface);border-radius:0 0 12px 12px;box-shadow:0 -4px 12px rgba(23,33,28,.06)}}
/* Treinamento (043, mockups/treinamento.html): Minhas aulas, Dentro da aula, a janela da porta e Treinamento da equipe. Regras do mockup com o prefixo tr- (classe curta herda regra global). */
.tr-ocards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.tr-oc{all:unset;box-sizing:border-box;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;text-align:left;display:grid;gap:2px;border-top:3px solid var(--c,var(--brand))}
button.tr-oc{cursor:pointer}
.tr-oc:focus-visible{outline:2px solid var(--leaf);outline-offset:2px}
.tr-oc[aria-pressed="true"]{box-shadow:inset 0 0 0 2px var(--c,var(--brand))}
.tr-oc span{font-size:12px;color:var(--muted)}.tr-oc b{font:800 26px var(--f-display)}.tr-oc small{font-size:11.5px;color:var(--faint)}
.tr-two{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:1000px){.tr-two{grid-template-columns:1fr}}
.tr-pill{font:500 10.5px var(--f-mono);letter-spacing:.04em;padding:2px 7px;border-radius:4px;white-space:nowrap;display:inline-block}
.tr-p-aviso{background:var(--blue-soft);color:var(--blue)}.tr-p-carencia{background:var(--amber-soft);color:var(--amber)}.tr-p-trava{background:var(--red-soft);color:var(--red)}
.tr-setores{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px} /* mockup: 3 colunas no computador */
@media (max-width:1180px){.tr-setores{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.tr-setores{grid-template-columns:1fr}}
.tr-setor h4{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding-bottom:5px;border-bottom:2px solid var(--brand);margin:0 0 6px;display:flex;justify-content:space-between}
.tr-setor.fora h4{border-color:var(--line2);color:var(--faint)}
.tr-no{display:flex;gap:8px;align-items:center;width:100%;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:7px;padding:6px 8px;margin-bottom:5px;font-size:12.5px;cursor:pointer;color:inherit}
.tr-no[aria-pressed="true"]{box-shadow:inset 0 0 0 2px var(--brand)}
.tr-no .cod{font:500 11px var(--f-mono);color:var(--brand);min-width:30px}
.tr-no .t{flex:1;min-width:0;line-height:1.3}
.tr-st{width:18px;height:18px;border-radius:50%;flex:none;display:grid;place-items:center;font:700 10px var(--f-mono);color:#fff;background:var(--line2);font-style:normal}
.tr-e-comprovada .tr-st{background:#2B7A33}.tr-e-aprovada .tr-st{background:var(--leaf)}.tr-e-andamento .tr-st{background:var(--blue)}
.tr-e-revisar .tr-st{background:var(--amber)}.tr-e-bloqueada .tr-st{background:var(--faint)}.tr-e-disponivel .tr-st{background:transparent;border:2px solid var(--brand)}
.tr-e-atrasada{border-color:var(--red)}.tr-e-atrasada .tr-st{background:var(--red)}
.tr-e-fora,.tr-e-gravando{opacity:.45}
.tr-leg{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:var(--muted)}.tr-leg span{display:flex;gap:5px;align-items:center}.tr-leg .tr-st{width:12px;height:12px}
.tr-selos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tr-selo{border:1px solid var(--line);border-radius:8px;padding:8px;text-align:center;font-size:12px}.tr-selo b{display:block;font-size:13px}
.tr-selo.ok{background:var(--leaf-soft);border-color:var(--leaf)}.tr-selo.na{background:var(--sunk);color:var(--faint)}
.tr-aviso{border-left:4px solid var(--amber);background:var(--amber-soft);padding:10px 12px;border-radius:6px;font-size:13px}
.tr-aviso.bom{border-color:var(--leaf);background:var(--leaf-soft)}
.tr-ruim{border-left:4px solid var(--red);background:var(--red-soft);padding:10px 12px;border-radius:6px;font-size:13px}
.tr-q{display:grid;gap:6px;padding-block:10px;border-top:1px solid var(--line)}.tr-q:first-child{border-top:0}
.tr-op{border:1px solid var(--line2);background:var(--bg);border-radius:7px;padding:7px 10px;text-align:left;font-size:13.5px;cursor:pointer;color:inherit}
.tr-op[aria-pressed="true"]{border-color:var(--brand);background:var(--brand-soft)}.tr-op.c{border-color:var(--leaf);background:var(--leaf-soft)}.tr-op.e{border-color:var(--red);background:var(--red-soft)}
.tr-video{width:100%;border-radius:8px;background:#000;display:block}
.tr-tw{overflow-x:auto}
.tr-tab{border-collapse:collapse;width:100%;font-size:13px}
.tr-tab th,.tr-tab td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.tr-tab th{font:500 10.5px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.tr-tab tr.pes{cursor:pointer}.tr-tab tr.pes:hover td{background:var(--sunk)}.tr-tab tr.pes[aria-selected="true"] td{background:var(--brand-soft)}
.tr-cel{display:grid;gap:3px;min-width:62px}.tr-cel .mono{font-size:11.5px}
.tr-flag{font:600 10px var(--f-mono);padding:1px 5px;border-radius:3px}
.tr-f-at{background:var(--red-soft);color:var(--red)}.tr-f-pr{background:var(--amber-soft);color:var(--amber)}.tr-f-ok{background:var(--leaf-soft);color:#2B7A33}
.tr-av{width:30px;height:30px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font:700 11px var(--f-display);flex:none}
.tr-chk{display:grid;grid-template-columns:22px 1fr;gap:8px;align-items:start;font-size:13px;padding:6px 0;border-top:1px dashed var(--line)}
.tr-chk input{width:17px;height:17px;accent-color:var(--leaf);margin-top:2px}
.tr-falta{display:flex;justify-content:space-between;gap:8px;font-size:13px;border-top:1px dashed var(--line);padding-top:6px}
.tr-btn-am{background:var(--amber);border-color:var(--amber);color:#fff}
.tr-filtro.on{background:var(--brand);color:#fff;border-color:var(--brand)}
.modal:has(.tr-janela){width:min(520px,100%)}
.modal:has(.tr-janela) textarea{width:100%;border:1px solid var(--line2);border-radius:6px;padding:6px;font:inherit}