/* Utilizado para colocar um elemento no fundo caso esteja usando display
 flex*/
.flex-bottom{
	display:flex;
	flex-direction: column-reverse;
}

.justified-line{
	display: flex;
	justify-content: space-between;
}

.justified-line-evenly{
	display: flex;
	justify-content: space-evenly;
}

.header-textarea-top{
	float: left;
	margin-right: 2px;
}

.align-input-right{
	float: right;
}

.label-begining-input{
	text-align: left;
}

.vertical-center-itens{
	display:flex;
	justify-content: center;
	align-items: center;
}

.title{
	width: 115px;
	display: inline-block;
	text-align:right;
}

.right-corner{
	float: right;
	margin-bottom:6px;
	margin-right:6px;
	height:200px;
	display: flex;
	flex-direction: column-reverse;
}

.scroll-container{
	overflow: auto;
	max-height: 320px;
}

.scroll-content{	
	width: 700px;
}

.form-element{
	margin: 6px;
}

/*Caso necessite utilizar a regra de form-element 
em conjunto com uma div com a regra center
pois a regra de center depende de margin
*/

.form-element-padding{
	padding: 6px;
}

.center{
	margin: auto;
	width: 50%;
}

.center-60{
	margin: auto;
	width: 60%;
}

.header-form{
	height: 20px;
	vertical-align: middle;
	display: table;
	width: 100%;
}

.vertical-middle-text{
	display: table-cell;
	vertical-align: middle;
}

.header-title{
	display: table-cell;
	vertical-align: middle;
	padding-left: 1%;
}

.td-text{
    white-space: nowrap;
   	padding-right: 10px;
}

.tdFixed {
	   min-width:60px;
      height:30px;
      white-space: nowrap;
      padding-right: 10px;
}

.table {
	display:table; 
}

.table-fixed{
	display: table;
	table-layout: fixed;	
} 

.row {
	display:table-row;
}

.cell {
	display:table-cell;
}

/* As duas classes register-count a seguir são usadas para encapsular a linha do
contador de registros. A Div do Row deve encapsular a do text. Basta adicionar
a variável ${msgRegistrosEncontrados} dentro da div do text para obter o efeito
desejado */
div.register-count-row {
	margin: auto;
	width: 90%;
	height: 24px;
	display: table;
}

div.register-count-text {
	vertical-align: middle;
	display: table-cell;
}

/*As sete classes a seguir (cinco divs e duas livres) são usadas 
para construir a linha de botões e legendas de ícones logo acima da Grid*/
div.grid-upper-row {
	margin: auto;
	height: 24px;
	display: flex;
	justify-content: space-between;
}

div.left-buttons {
	display: inline-block;
	height: inherit;
	padding-left: 1%;
	text-align: left;
}

div.right-subs {
	display: inline-block;
	height: inherit;
	padding-right: 1%;
	text-align: right;
}

div.button-cell {
	display: table-cell;
	height: inherit;
	vertical-align: middle;
}

div.subtitle-cell {
	display: table-cell;
	height: inherit;
	vertical-align: middle;
}

.padding-left-15 {
	padding-left: 15px;
}

.padding-right-5 {
	padding-right: 5px;
}

/* Essa classe deve ser aplicada juntamente com a classe label em textos para que o mesmo
fique em negrito e do tamanho apropriado */
.font-11 {
	font-size: 11px;
}

/* Classes extras */
.min-width-200 {
	min-width: 200px;
}

.min-width-250 {
	min-width: 250px;
}

.min-width-500 {
	min-width: 500px;
}

.text-align-left {
	text-align: left;
}

.text-align-right {
	text-align: right;
}

.text-align-center {
	text-align: center;
}

.in-block {
	display: inline-block;
}

.max-content {
	width: max-content;
}

/* Classes de width com porcentagem */
.w_34 {
	width: 34%;
}

.w_99 {
	width: 99%;
}

.container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px; /* Define espaçamento entre os itens */
}

.div_esquerda {
	flex: 1;
	text-align: right;
}

.div_direita {
	flex: 2; /* Aumentei o tamanho relativo para que o campo de texto tenha mais espaço */
	text-align: left;
	padding-right: 18%; /* Mantido se necessário, mas pode ser ajustado ou removido */
}

@media (max-width: 768px) {
	.div_direita {
		padding-right: 5%; /* Ajuste de responsividade */
	}
}