/* =====================================================================
 *  MODULO COMERCIAL DA PLATAFORMA KRIGS - estilo. PARTE COMUM.
 *  Copiado byte a byte. Depende de krigs-tokens.css e krigs-componentes.css.
 *  Nenhuma cor literal: so os tokens oficiais.
 * ===================================================================== */

/* Segunda linha de uma celula (descricao, equivalente mensal). */
.cm-sub{ display:block; font-size:12px; color:var(--cinza); margin-top:2px; font-weight:400 }

/* Janela larga (formularios de plano, proposta e fatura). */
dialog.cm-largo{ width:min(760px, calc(100vw - 32px)) }

/* Botoes da linha em vagas fixas: nenhum cai de linha. */
.cm-acoes-3{ grid-auto-flow:column; grid-auto-columns:84px }
.cm-acoes-4{ grid-auto-flow:column; grid-auto-columns:84px }
.cm-acoes-5{ grid-auto-flow:column; grid-auto-columns:84px }

@media (max-width:760px){
  .cm-acoes-3,.cm-acoes-4,.cm-acoes-5{ grid-auto-flow:row; grid-auto-columns:auto;
    grid-template-columns:repeat(2, minmax(0, 1fr)) }
}

/* Titulo do bloco "Plano e cobranca" dentro do Editar empresa. */
.cm-bloco{ margin-top:18px; padding-top:14px; border-top:1px solid var(--linha) }
.cm-titulo-bloco{ margin:0 0 6px }

/* As abas do Faturamento. */
.cm-abas{ display:flex; gap:4px; flex-wrap:wrap; border-bottom:1px solid var(--linha); margin:0 0 16px }
.cm-aba{ background:none; border:0; border-bottom:2px solid transparent; padding:9px 14px; margin-bottom:-1px;
  font:inherit; font-weight:600; color:var(--cinza); cursor:pointer; border-radius:var(--raio-sm) var(--raio-sm) 0 0 }
.cm-aba:hover{ color:var(--texto); background:var(--bg) }
.cm-aba:focus-visible{ outline:2px solid var(--azul-2); outline-offset:2px }
.cm-aba-ativa{ color:var(--azul); border-bottom-color:var(--azul) }

/* Barra de acoes acima da lista, e os cartoes das abas de configuracao. */
.cm-barra{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin:14px 0 }
.cm-cartao{ margin-bottom:16px }
.cm-cartao .form-acoes{ margin-top:14px; display:flex; gap:10px; flex-wrap:wrap }

/* O titulo do bloco Comercial no Painel do Provedor. */
.cm-titulo-painel{ margin:22px 0 12px }