/* HUB do Grupo ITIBAN: area da Kelly Keith, conteudo do site (T-0771). Usa os tokens de app.css; sem estilo inline (CSP).
   Computador: coluna de leitura de ate 980 px (formulario ate 860 px). Celular (ate 700 px): alvos de 48 px, campos com 16 px,
   botoes em coluna e registro em cartoes (table.rsp do app.css), sem rolagem lateral. */
.kk-tela{max-width:980px}
.kk-tela>.rule{margin-bottom:12px}
.kk-quem{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}
.kk-topo{margin-top:0}
.kk-lista{list-style:none;margin:0;padding:0}
.kk-it{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
.kk-lista>li:last-child{border-bottom:0}
.kk-tx{flex:1 1 18rem;min-width:0;display:flex;flex-direction:column;gap:3px}
.kk-tx b{font-weight:650;overflow-wrap:anywhere}
.kk-tx .small{overflow-wrap:anywhere}
.kk-tx .est{margin-top:4px}
.kk-trecho{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.kk-it .ac{display:flex;gap:6px;align-items:center;flex-wrap:wrap;flex:none}
.kk-form{max-width:860px}
.kk-form h3{margin:10px 0 4px}
.kk-form .kk-sub{margin-top:22px}
.kk-form textarea{min-height:88px}
.kk-form textarea.kk-longo{min-height:160px}
.kk-tela input[type=number],.kk-tela input[type=date]{width:100%;font:inherit;font-size:15px;padding:10px 12px;min-height:44px;border:1px solid var(--bc,#8a8678);border-radius:9px;background:var(--surf);color:var(--txt)}
.kk-tela input[type=number]:focus,.kk-tela input[type=date]:focus{outline:none;border-color:#142e4f;box-shadow:0 0 0 3px rgba(20,46,79,.25)}
.kk-tela input[type=number]:disabled,.kk-tela input[type=date]:disabled{background:var(--bg);color:var(--mut);cursor:not-allowed}
.kk-form input[type=number]{max-width:140px}
.kk-secao{border:1px solid var(--line);border-radius:12px;padding:4px 14px 12px;margin:12px 0;background:var(--surf);min-width:0}
.kk-secao legend{font-weight:650;padding:0 6px;color:var(--txt2)}
.kk-chk{display:flex;align-items:flex-end}
.kk-chk .av-pref{width:100%;border-bottom:0}
.kk-img{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px;align-items:end}
.kk-img select{width:100%}
.kk-previa{grid-column:1/-1;display:block;max-width:100%;max-height:220px;margin-top:10px;border-radius:10px;border:1px solid var(--line);object-fit:contain;background:var(--bg2)}
.kk-tela .tab.on{color:#fff}
.kk-dado summary{cursor:pointer;color:var(--txt2);font-weight:600;text-decoration:underline;text-underline-offset:3px;min-height:32px;display:flex;align-items:center}
.kk-dado[open] summary{margin-bottom:6px}
.kk-dado pre{max-height:420px;overflow:auto}
@media (max-width:900px),(pointer:coarse){
  .kk-tela input[type=number],.kk-tela input[type=date]{min-height:44px;font-size:16px}
}
@media(max-width:700px){
  .kk-tela .card{padding:16px}
  .kk-tela input[type=number],.kk-tela input[type=date]{min-height:48px;font-size:16px}
  .kk-form input[type=number]{max-width:none}
  .kk-img{grid-template-columns:minmax(0,1fr)}
  .kk-it .ac{width:100%;display:grid;grid-template-columns:minmax(0,1fr)}
  .kk-it .ac .btn,.kk-topo .btn,.kk-form .btns .btn{width:100%}
  .kk-secao{padding:4px 10px 10px}
  .kk-dado summary{min-height:44px;justify-content:flex-end}
  .kk-tela table.rsp td:has(.kk-dado[open]){flex-wrap:wrap}
  .kk-dado[open]{flex:1 1 100%;text-align:left}
  .kk-dado[open] summary{justify-content:flex-start}
}