/*
 * Camada de compatibilidade: faz o HTML antigo (div.label / div.campo / div.campo_lista
 * com width em % inline e float) se comportar bem dentro do tema novo.
 * Vale somente dentro de .portal-conteudo. Some quando cada tela for convertida
 * para o grid do Bootstrap (Fases 1 a 3 do PLANO_BOOTSTRAP.md).
 */
.portal-conteudo { font-size: 1rem; }
.portal-conteudo::after { content: ""; display: table; clear: both; }

/* ---- colunas (o styles.css antigo nao carrega no tema novo) ---- */
.portal-conteudo .label, .portal-conteudo .campo, .portal-conteudo .campo_lista,
.portal-conteudo .label_titulo, .portal-conteudo .label_item_lista { float: left; box-sizing: border-box; }
.portal-conteudo .formulario { float: left; width: 100%; }
.portal-conteudo .label { margin-left: 2px; }
.portal-conteudo .campo { margin-left: 5px; }

/* ---- texto e rotulos ---- */
.portal-conteudo .label,
.portal-conteudo .label_item_lista { font-size: .875rem; color: var(--portal-texto-suave); font-weight: 600; margin-top: .35rem; }
.portal-conteudo .label_titulo { font-size: .8rem; color: #fff; background: var(--portal-petroleo); padding: .3rem .4rem; border: 0; border-right: 1px solid rgba(255,255,255,.25); height: auto !important; line-height: 1.3; }
.portal-conteudo .campo,
.portal-conteudo .campo_lista {
  font-family: inherit; font-size: .9rem; font-weight: 500; color: var(--portal-texto);
  height: auto !important; min-height: 1.9rem; line-height: 1.4; background: none; padding: .25rem .4rem;
  border: 0; border-bottom: 1px solid var(--portal-borda); margin: 0 0 .25rem 0;
  overflow-wrap: anywhere; box-sizing: border-box;
}
.portal-conteudo .campo { background: #f7f9fa; border: 1px solid var(--portal-borda); border-radius: .25rem; padding: .25rem .5rem; margin-bottom: .4rem; }
.portal-conteudo .campo_lista { font-size: .875rem; min-height: 1.7rem; }
.portal-conteudo div[style*="height"] { height: auto !important; min-height: 1.7rem; }

/* ---- agrupamentos ---- */
.portal-conteudo .formulario { background: transparent; border: 0; }
.portal-conteudo fieldset { border: 1px solid var(--portal-borda); border-radius: .5rem; padding: .75rem 1rem 1rem; margin: 0 0 1rem; min-width: 0; overflow: hidden; background: var(--portal-superficie); }
.portal-conteudo legend { float: none; width: auto; font-size: 1rem; font-weight: 600; color: var(--portal-petroleo); padding: 0 .5rem; margin: 0; }
.portal-conteudo hr { clear: both; margin: .5rem 0; border-color: var(--portal-borda); opacity: 1; }
.portal-conteudo #msg_erro, .portal-conteudo .msg_erro { color: #842029; background: #f8d7da; border: 1px solid #f1aeb5; border-left: 4px solid #b02a37; border-radius: .375rem; padding: .5rem .75rem; margin: .5rem 0; }

/* ---- campos de formulario (16px evita o zoom automatico no iPhone) ---- */
.portal-conteudo input[type="text"], .portal-conteudo input[type="password"], .portal-conteudo input[type="email"],
.portal-conteudo input[type="number"], .portal-conteudo input[type="date"], .portal-conteudo input:not([type]),
.portal-conteudo select, .portal-conteudo textarea, .portal-conteudo .campo_login {
  font: inherit; font-size: 1rem; color: var(--portal-texto); background: #fff;
  border: 1px solid #aeb7bc; border-radius: .375rem; padding: .4rem .6rem; max-width: 100%; box-sizing: border-box; height: auto;
}
.portal-conteudo input:focus, .portal-conteudo select:focus, .portal-conteudo textarea:focus { border-color: var(--portal-verde-claro); box-shadow: 0 0 0 .2rem rgba(23,145,118,.25); outline: 0; }
.portal-conteudo input[readonly], .portal-conteudo input[disabled], .portal-conteudo textarea[readonly] { background: #eef1f2; }
.portal-conteudo .botao, .portal-conteudo input[type="submit"]:not(.btn), .portal-conteudo button:not(.btn):not(.nav-link):not(.accordion-button) {
  font: inherit; font-size: 1rem; font-weight: 600; color: #fff; background: var(--portal-verde); border: 1px solid var(--portal-verde);
  border-radius: .375rem; padding: .45rem 1rem; cursor: pointer; text-decoration: none;
}
.portal-conteudo .botao:hover, .portal-conteudo input[type="submit"]:not(.btn):hover, .portal-conteudo button:not(.btn):not(.nav-link):not(.accordion-button):hover { background: var(--portal-petroleo); border-color: var(--portal-petroleo); }
.portal-conteudo input[type="image"] { max-height: 2rem; width: auto; }
.portal-conteudo img { max-width: 100%; height: auto; }
.portal-conteudo a:not(.btn) { color: var(--portal-verde); }
.portal-conteudo .paginador { font-size: .9rem; }

/* ---- celular e tablet estreito: empilha tudo ---- */
@media (max-width: 767.98px) {
  .portal-conteudo div[style*="width"],
  .portal-conteudo form[style*="width"],
  .portal-conteudo .label, .portal-conteudo .campo, .portal-conteudo .campo_lista,
  .portal-conteudo .label_titulo, .portal-conteudo .label_item_lista, .portal-conteudo .formulario {
    float: none !important; width: 100% !important; max-width: 100% !important; margin-left: 0 !important; display: block;
  }
  /* colunas estreitas que guardam icones/botoes ficam lado a lado, sem ocupar a linha */
  .portal-conteudo div[style*="width:18px"], .portal-conteudo div[style*="width:20px"], .portal-conteudo div[style*="width:2%"],
  .portal-conteudo div[style*="width:3%"], .portal-conteudo div[style*="width:5%"], .portal-conteudo div[style*="width:1%"] {
    display: inline-block !important; width: auto !important; min-width: 2.25rem; vertical-align: middle; margin-right: .25rem;
  }
  .portal-conteudo input[type="text"], .portal-conteudo input[type="password"], .portal-conteudo input[type="email"],
  .portal-conteudo input[type="number"], .portal-conteudo select, .portal-conteudo textarea, .portal-conteudo .campo_login { width: 100%; }
  .portal-conteudo .campo_lista { border-bottom: 1px solid var(--portal-borda); padding-left: 0; }
  /* cabecalho das listas (rotulos de coluna) some no celular; os dados ja trazem o contexto */
  .portal-conteudo .label_titulo { text-align: left; }
  .portal-conteudo table { display: block; overflow-x: auto; max-width: 100%; }
  .portal-conteudo iframe { max-width: 100%; }
}

/* login: o conteudo antigo fixa 230px */
.portal-login #login, .portal-login #login form { width: 100% !important; }

/* autocomplete de matricula (Iface_Autocomplete): ocupa a largura toda no tema novo */
.portal-conteudo input[id^="auto_complete_"], .portal-conteudo select[id^="Auto_complete_"] { width: 100% !important; }
.portal-conteudo select[multiple] { min-height: 7rem; }
.ui-autocomplete { z-index: 2000 !important; max-height: 16rem; overflow-y: auto; overflow-x: hidden; font-size: .95rem; }
