@CHARSET "UTF-8";

.ui-messages {
	margin: 0 !important;
}

.ui-messages-warn, .ui-messages-error, .ui-messages-info {
	margin: 5px !important;
}

body .ui-panelmenu .ui-panelmenu-header {
	padding: 10px !important;
}

body .ui-panelmenu .ui-panelmenu-content {
	padding: 0 !important;
}

body .ui-panel .ui-panel-titlebar {
	padding: .5rem;
}

body .ui-toolbar {
	padding: .5rem;
}

fieldset {
	/* 	border: none !important;
	border-top: 1px solid #ddd !important; */
	padding-top: 1rem !important;
	margin-top: 10px;
}

fieldset legend {
	border: none !important;
	padding: 3px 6px !important;
}

body .ui-toolbar .ui-button {
	margin: 1px;
}

body .ui-menubutton .ui-button {
	margin-right: .1em;
}

body .ui-datatable .ui-datatable-data>tr>td {
	padding: 0.75rem;
}

.ui-panelgrid-cell {
	padding: 3px !important;
}

.no_borders>.ui-panelgrid-content {
	border: none !important;
}

.ui-inputfield.hasDatepicker {
	text-align: center;
}

/*
Movido para os arquivos primefaces_light/primefaces_dark para ajustar as cores
.ui-panelmenu .ui-panelmenu-header.ui-state-active {
	background-color: #f4f4f4 !important;
}


.ui-panelmenu .ui-panelmenu-header.ui-state-active * {
	color: #333 !important;
}
*/

.ui-selectonemenu {
	min-width: auto !important;
}

.ui-selectonemenu .ui-selectonemenu-label {
	white-space: pre-wrap !important;
}

.ui-selectonemenu-panel .ui-selectonemenu-item {
	white-space: normal !important;
}

.ui-column-title {
	font-weight: bold !important;
}

.ui-widget.ui-selectbooleancheckbox.ui-chkbox {
	height: auto !important;
	display: flex !important;
}

.ui-widget.ui-selectbooleancheckbox.ui-chkbox>.ui-widget.ui-chkbox-box {
	min-width: 20px !important;
	margin: auto 0 !important;
}

/* AQUI: para o autocomplete ficar com tamanho fixo na hora do dropdown */
.ui-autocomplete-panel {
	overflow: auto;
	/*height: 300px !important;*/
	max-height: 300px !important;
}

@media ( max-width : 767px) {
	table .ui-datatable-data td {
		width: 100% !important;
		text-align: left !important;
	}
	table .ui-datatable-data td .ui-column-title {
		width: 100% !important;
	}
}

/*
 * PrimeFaces 16: a .ui-dialog virou a CAMADA do tamanho da tela (com rolagem) e a janela visível é o
 * filho .ui-dialog-box. O styleClass do p:dialog continua indo para a camada, então toda regra que
 * dimensiona a janela tem de mirar ".ui-dialog-box" - senão encolhe/descentraliza a camada inteira.
 * A estrutura da camada vem do tema (sass/theme/designer/components/overlay/_dialog.scss).
 * Ver docs/MIGRACAO_PRIMEFACES_16.md.
 *
 * O antigo "margin: 0 10px" da .ui-dialog saiu: quem dá o respiro da borda agora é o padding da
 * camada. 1rem (o tema traz 1.5rem): os dialogs grandes têm "max-height: calc(100vh - 2rem)", que
 * só cabe sem rolagem dupla com 1rem em cima + 1rem embaixo. No celular .5rem, para os de 95vw
 * caberem. Dialogs de altura/tela cheia zeram o padding no próprio CSS deles.
 */
body .ui-dialog {
	padding: 1rem;
}

.ui-dialog .ui-dialog-box {
	max-width: 1200px !important;
}

@media ( max-width : 767px ) {
	body .ui-dialog {
		padding: .5rem;
	}

	/* Janela nunca mais larga que a camada no celular (ex.: width="25rem" do aviso de sessão numa
	   tela de 360px). Substitui os antigos style="max-width:95vw" / styleClass="w-full sm:w-..."
	   que iam na .ui-dialog e no PF 16 encolhem a camada em vez da janela. */
	.ui-dialog .ui-dialog-box {
		max-width: 100% !important;
	}
}

/*
 * A camada NUNCA é pintada. Várias telas põem classes de cor no styleClass do dialog (status da OS
 * "osStatusXxx", canal do atendimento "atdOrigemXxx", operação do Superman "supOpXxx" - cores.css),
 * e essas classes trazem fundo e filete lateral com !important. No PF 15 isso caía na janela; no
 * PF 16 cairia na tela inteira (fundo tingido e uma faixa colorida na borda da tela). A cor de cada
 * janela é aplicada na .ui-dialog-box pelo CSS do próprio dialog (atd-dialog, sup-dialog...).
 */
body .ui-dialog,
body .ui-dialog[class] {
	background: transparent !important;
	border: 0 none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

/* Status da OS no styleClass do dialog (dialog_editar_ordem_servico): o filete lateral que a classe
   osStatusXxx punha na janela, agora na caixa, pela variável que a própria classe publica. */
body .ui-dialog[class*="osStatus"] > .ui-dialog-box {
	border-left: 3px solid var(--os-status-color, transparent) !important;
}

.ui-dialog.dialog_full_width .ui-dialog-box {
	width: 94vw !important;
}

.ui-dialog.dialog_full_width_400 .ui-dialog-box {
	width: 400px !important;
}

.ui-dialog.dialog_full_width_500 .ui-dialog-box {
	width: 500px !important;
}

.ui-dialog.dialog_full_width_600 .ui-dialog-box {
	width: 600px !important;
}

.ui-dialog.dialog_full_width_700 .ui-dialog-box {
	width: 700px !important;
}

.ui-dialog.dialog_full_width_800 .ui-dialog-box {
	width: 800px !important;
}

.ui-dialog.dialog_full_height .ui-dialog-box {
	height: 97vh !important;
}

.ui-dialog.dialog_full_height .ui-dialog-content {
	height: 90% !important;
	overflow: auto !important;
}

@media ( max-width : 767px ) {
	.ui-dialog.mob_dialog_full_height .ui-dialog-box {
		height: 97vh !important;
	}
	.ui-dialog.mob_dialog_full_height .ui-dialog-content {
		height: 90% !important;
		overflow: auto !important;
	}
	.ui-dialog.dialog_full_width_400 .ui-dialog-box {
		width: 95% !important;
	}
	.ui-dialog.dialog_full_width_500 .ui-dialog-box {
		width: 95% !important;
	}
	.ui-dialog.dialog_full_width_600 .ui-dialog-box {
		width: 95% !important;
	}
	.ui-dialog.dialog_full_width_700 .ui-dialog-box {
		width: 95% !important;
	}
	.ui-dialog.dialog_full_width_800 .ui-dialog-box {
		width: 95% !important;
	}
}