/*
 * Tema do SISGENFe: mesmo design do painel inicial (painel.css) e da barra superior
 * (menu.css). Carregado por último em default-view.xhtml (e nas telas avulsas) para
 * sobrescrever systema.css e o tema PrimeFaces "systema" sem alterar as telas.
 *
 * Cores: primária #0b5394, escura #0b3e6f, fundo #f3f4f6, borda #dde1e6,
 * texto #333 / #666, perigo #c0392b, alerta #e67e22, sucesso #27ae60, info #2e86c1.
 */

/* ---------- Base ---------- */

html, body {
	background: #f3f4f6 !important;
}

body, .ui-dialog .ui-dialog-content {
	background-color: #f3f4f6;
	color: #333;
}

.ui-dialog .ui-dialog-content {
	background-color: #fff;
}

* {
	font-family: Arial, Helvetica, sans-serif;
}

p, span, div, table, tr, td, th, form, input, label, body, select, textarea, button {
	font-size: 12px;
}

a {
	color: #0b5394;
}

label {
	font-weight: bold;
	color: #444;
	margin-bottom: 2px;
}

fieldset {
	border: 1px solid #dde1e6;
	border-radius: 4px;
	box-shadow: none;
	background: #fff;
	padding: 8px 10px;
}

fieldset > legend {
	color: #0b3e6f;
	padding: 0 6px;
}

/* ---------- Campos ---------- */

input, select, textarea {
	height: 30px;
	padding: 4px 8px;
	border: 1px solid #c9d1da;
	border-radius: 4px;
	box-sizing: border-box;
	color: #333;
	transition: border-color .15s, box-shadow .15s;
}

textarea {
	height: auto;
}

input[type=checkbox], input[type=radio] {
	height: auto;
}

input:focus, select:focus, textarea:focus,
.ui-inputfield.ui-state-focus {
	outline: none;
	border-color: #0b5394 !important;
	box-shadow: 0 0 0 2px rgba(11, 83, 148, .15) !important;
}

.ui-inputfield, .ui-widget-content .ui-inputfield {
	border: 1px solid #c9d1da;
	border-radius: 4px;
	box-shadow: none;
	background: #fff;
}

input.ui-state-disabled, select.ui-state-disabled, textarea.ui-state-disabled,
input[disabled], input[readonly], select[disabled], textarea[disabled] {
	background-color: #f5f6f8 !important;
	color: #555;
}

.ui-selectonemenu, .ui-selectcheckboxmenu {
	border: 1px solid #c9d1da;
	border-radius: 4px;
	background: #fff;
}

.ui-selectonemenu .ui-selectonemenu-trigger, .ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger {
	background: #fff;
	border: none;
	border-left: 1px solid #e5e8ec;
}

.ui-chkbox .ui-chkbox-box, .ui-radiobutton .ui-radiobutton-box {
	background: #fff;
	border: 1px solid #b8c2cc;
	border-radius: 3px;
}

.ui-radiobutton .ui-radiobutton-box {
	border-radius: 50%;
}

.ui-chkbox .ui-chkbox-box.ui-state-active, .ui-radiobutton .ui-radiobutton-box.ui-state-active {
	background: #0b5394;
	border-color: #0b5394;
}

.ui-chkbox .ui-chkbox-box.ui-state-active .ui-icon, .ui-radiobutton .ui-radiobutton-box.ui-state-active .ui-icon {
	filter: brightness(0) invert(1);
}

.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {
	border-color: #c0392b !important;
	box-shadow: 0 0 0 2px rgba(192, 57, 43, .12);
}

/* ---------- Cabeçalhos ---------- */

.ui-widget-header {
	background: #0b3e6f;
	border-color: #0b3e6f;
	color: #fff;
}

/* Título das telas de cadastro (comp:simpleHeader) */
.crudHeader {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 48px;
	padding: 0 16px;
	background: #fff !important;
	border: none !important;
	border-bottom: 1px solid #dde1e6 !important;
	border-radius: 0;
	color: #0b3e6f !important;
	text-shadow: none !important;
	text-transform: none;
	font-weight: bold;
	font-size: 18px !important;
}

.crudHeader span, .crudHeader * {
	font-size: inherit;
	color: inherit;
}

.crudHeader > span:first-child {
	margin: 0 !important;
}

/* ---------- Barra de ações (botões grandes coloridos) ---------- */

.btn-bar {
	background: #fff !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .08) !important;
	border-bottom: 1px solid #dde1e6 !important;
	padding: 8px 12px !important;
}

.btn-bar > .ui-panel-content {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
	padding: 0;
}

.btn-bar > .ui-panel-content > span {
	display: contents;
}

.color-btn {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	min-height: 34px !important;
	height: 34px;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 12px !important;
	border: 1px solid #c9d1da !important;
	border-radius: 4px !important;
	background: #fff !important;
	box-shadow: none !important;
	transition: background .15s, border-color .15s;
	vertical-align: middle;
}

.color-btn:hover {
	background: #e8f0f8 !important;
	border-color: #0b5394 !important;
	box-shadow: none !important;
}

.color-btn > .fa, .color-btn > .far, .color-btn > .fas {
	position: static !important;
	width: auto !important;
	height: auto !important;
	margin: 0 !important;
	font-size: 15px !important;
	color: #0b5394;
	text-shadow: none !important;
}

.color-btn:hover > .fa, .color-btn:hover > .far {
	text-shadow: none !important;
}

.color-btn > .ui-button-text,
.color-btn > .fa + .ui-button-text,
.color-btn > .far + .ui-button-text {
	padding: 0 !important;
	margin: 0 !important;
	font-size: 12px !important;
	font-weight: normal;
	color: #333 !important;
	white-space: nowrap;
	line-height: 32px;
}

/* Variantes: a cor fica no ícone; a ação principal (azul) é preenchida */
.color-btn.blue {
	background: #0b5394 !important;
	border-color: #0b5394 !important;
}

.color-btn.blue:hover {
	background: #0a4a85 !important;
}

.color-btn.blue > .fa, .color-btn.blue > .far, .color-btn.blue > .ui-button-text {
	color: #fff !important;
}

.color-btn.light-blue > .fa, .color-btn.light-blue > .far { color: #2e86c1; }

.color-btn.yellow > .fa, .color-btn.yellow > .far,
.color-btn.orange > .fa, .color-btn.orange > .far { color: #d68910; }
.color-btn.red > .fa, .color-btn.red > .far { color: #c0392b; }
.color-btn.red:hover { background: #fdecea !important; border-color: #c0392b !important; }
.color-btn.green > .fa, .color-btn.green > .far { color: #27ae60; }
.color-btn.purple > .fa, .color-btn.purple > .far { color: #8e44ad; }
.color-btn.gray > .fa, .color-btn.gray > .far,
.color-btn.white > .fa, .color-btn.white > .far { color: #555; }

/* Botão só com ícone (cabeçalhos) */
.color-btn.header {
	width: 34px;
	padding: 0 !important;
	justify-content: center;
}

.color-btn.header > .fa, .color-btn.header > .far {
	font-size: 16px !important;
}

.color-btn.ui-state-disabled {
	opacity: .5;
}

/* Fundos das antigas classes de cor fora dos botões grandes */
.blue:not(.color-btn) { background: #0b5394 !important; }
.yellow:not(.color-btn) { background: #f5b041 !important; }
.red:not(.color-btn) { background: #c0392b !important; }
.green:not(.color-btn) { background: #27ae60 !important; }
.gray:not(.color-btn) { background: #95a5a6 !important; }
.white:not(.color-btn) { background: #fff !important; }

/* ---------- Botões comuns ---------- */

.ui-button:not(.color-btn) {
	border: 1px solid #c9d1da;
	border-radius: 4px;
	background: #fff;
	color: #333;
	box-shadow: none;
	text-shadow: none;
}

.ui-button:not(.color-btn).ui-state-hover, .ui-button:not(.color-btn):hover {
	background: #e8f0f8;
	border-color: #0b5394;
	color: #0b5394;
}

.ui-button:not(.color-btn) .ui-button-text {
	color: inherit;
	font-weight: normal;
}

.ui-button-text-only .ui-button-text {
	padding: 6px 14px;
}

.ui-button-text-icon-left .ui-button-text {
	padding: 6px 14px 6px 30px;
}

.saveButton, .yes-button, .ui-button.primario {
	background: #0b5394 !important;
	border-color: #0b5394 !important;
	color: #fff !important;
}

.saveButton .ui-icon, .yes-button .ui-icon {
	filter: brightness(0) invert(1);
}

.saveButton:hover, .yes-button:hover {
	background: #0a4a85 !important;
}

.chevel-button {
	border-radius: 4px;
	background: #fff !important;
	border: 1px solid #c9d1da !important;
	box-shadow: none;
}

/* ---------- Painéis ---------- */

.ui-panel {
	border: 1px solid #dde1e6;
	border-radius: 4px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
	margin-bottom: 12px;
}

.ui-panel.btn-bar {
	border: none;
	border-radius: 0;
	margin-bottom: 0;
}

.ui-panel .ui-panel-titlebar {
	background: #fff;
	border: none;
	border-bottom: 1px solid #e5e8ec;
	border-radius: 4px 4px 0 0;
	padding: 10px 14px;
}

.ui-panel .ui-panel-title {
	color: #0b3e6f;
	font-weight: bold;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: .03em;
}

.ui-panel .ui-panel-titlebar-icon {
	background: #fff;
	border: 1px solid #c9d1da;
	border-radius: 4px;
}

.ui-panel .ui-panel-titlebar-icon .ui-icon {
	opacity: .7;
}

.ui-panel-content {
	background: #fff;
}

.ui-widget-content {
	background: #fff;
}

/* ---------- Tabelas ---------- */

.ui-datatable {
	background: #fff;
}

.ui-datatable thead th,
.ui-datatable thead th.ui-state-default {
	background: #f5f7fa !important;
	border-color: #e1e5ea !important;
	color: #444;
	font-weight: bold;
	padding: 8px 6px;
}

.ui-datatable thead th.ui-state-hover {
	background: #e8f0f8 !important;
}

.ui-datatable thead th.ui-state-active {
	background: #dfe9f4 !important;
	color: #0b3e6f;
}

.ui-datatable tbody td {
	border-color: #eceff2 !important;
	padding: 6px 8px;
}

.ui-datatable-data > tr.ui-widget-content {
	border-color: #eceff2;
}

.ui-datatable-data > tr.ui-datatable-selectable:hover,
.ui-datatable-data > tr.ui-state-hover {
	background: #f3f8fc !important;
}

.ui-datatable-data > tr.ui-state-highlight,
.ui-datatable-data > tr.ui-state-highlight > td {
	background: #dbe8f5 !important;
	color: #0b3e6f !important;
	text-shadow: none;
}

.ui-datatable-even {
	background: #fafbfc;
}

.ui-datatable .ui-paginator, .ui-paginator {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
	background: #fff !important;
	border: none;
	border-top: 1px solid #e5e8ec;
	padding: 8px;
	color: #555;
}

.ui-paginator .ui-paginator-current {
	color: #555;
	font-size: 12px;
	padding: 0 2px;
}

.ui-paginator select {
	height: 32px;
	margin: 0;
	border: 1px solid #c9d1da;
	border-radius: 4px;
	background: #fff;
	color: #333;
}

.ui-paginator .ui-paginator-first, .ui-paginator .ui-paginator-prev,
.ui-paginator .ui-paginator-next, .ui-paginator .ui-paginator-last,
.ui-paginator .ui-paginator-page {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	height: 32px;
	margin: 0;
	padding: 0 6px;
	box-sizing: border-box;
	border: 1px solid #c9d1da;
	border-radius: 4px;
	background: #fff !important;
	color: #0b5394;
	text-decoration: none;
	cursor: pointer;
}

.ui-paginator .ui-paginator-first:hover, .ui-paginator .ui-paginator-prev:hover,
.ui-paginator .ui-paginator-next:hover, .ui-paginator .ui-paginator-last:hover,
.ui-paginator .ui-paginator-page:hover {
	background: #e8f0f8 !important;
	border-color: #0b5394;
}

.ui-paginator .ui-state-disabled, .ui-paginator .ui-state-disabled:hover {
	background: #fff !important;
	border-color: #e5e8ec;
	color: #b8c2cc;
	cursor: default;
	opacity: 1;
}

.ui-paginator .ui-paginator-page.ui-state-active {
	background: #0b5394 !important;
	border-color: #0b5394;
	color: #fff;
}

/* Setas da paginação com Font Awesome no lugar dos ícones-imagem do tema antigo */
.ui-paginator .ui-icon {
	width: auto;
	height: auto;
	margin: 0;
	background: none !important;
	text-indent: 0;
	font-size: 0;
	overflow: visible;
}

.ui-paginator .ui-icon::before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 14px;
	line-height: 1;
	color: currentColor;
}

.ui-paginator .ui-icon-seek-first::before { content: "\f100"; }
.ui-paginator .ui-icon-seek-prev::before { content: "\f104"; }
.ui-paginator .ui-icon-seek-next::before { content: "\f105"; }
.ui-paginator .ui-icon-seek-end::before { content: "\f101"; }

.ui-datatable-scrollable-body::-webkit-scrollbar-thumb {
	background: #b8c2cc !important;
	border-radius: 4px;
}

/* ---------- Diálogos ---------- */

.ui-dialog {
	border: none;
	border-radius: 6px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
	overflow: hidden;
	padding: 0;
}

.ui-dialog .ui-dialog-titlebar {
	background: #0b3e6f;
	border: none;
	border-radius: 0;
	padding: 12px 16px;
}

.ui-dialog .ui-dialog-title {
	color: #fff;
	font-size: 14px;
	font-weight: bold;
}

.ui-dialog .ui-dialog-titlebar-icon .ui-icon {
	filter: brightness(0) invert(1);
}

.ui-dialog .ui-dialog-content {
	padding: 12px 16px !important;
}

.ui-dialog .ui-dialog-buttonpane, .ui-confirm-dialog .ui-dialog-buttonpane {
	border-top: 1px solid #e5e8ec;
	background: #fafbfc;
	padding: 8px 16px;
}

.ui-widget-overlay {
	background: rgba(15, 30, 50, .45);
	opacity: 1;
}

/* ---------- Abas, acordeão e listas ---------- */

.ui-tabs .ui-tabs-nav {
	background: #fff;
	border: none;
	border-bottom: 1px solid #dde1e6;
	border-radius: 0;
}

.ui-tabs .ui-tabs-nav li {
	background: transparent;
	border: none;
	border-bottom: 2px solid transparent;
}

.ui-tabs .ui-tabs-nav li a {
	color: #555;
}

.ui-tabs .ui-tabs-nav li.ui-state-active {
	border-bottom-color: #0b5394;
}

.ui-tabs .ui-tabs-nav li.ui-state-active a {
	color: #0b3e6f;
	font-weight: bold;
}

.ui-accordion .ui-accordion-header {
	background: #fff;
	border: 1px solid #dde1e6;
	border-radius: 4px;
	color: #333;
}

.ui-accordion .ui-accordion-header.ui-state-active {
	background: #e8f0f8;
	color: #0b3e6f;
}

.ui-picklist .ui-picklist-caption, .ui-orderlist .ui-orderlist-caption {
	background: #f5f7fa;
	color: #0b3e6f;
	border: 1px solid #dde1e6;
}

.ui-autocomplete-panel, .ui-selectonemenu-panel, .ui-selectcheckboxmenu-panel {
	border: 1px solid #dde1e6;
	border-radius: 4px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .15);
}

.ui-selectonemenu-panel .ui-selectonemenu-item.ui-state-highlight,
.ui-autocomplete-panel .ui-autocomplete-item.ui-state-highlight {
	background: #0b5394;
	color: #fff;
}

/* ---------- Mensagens ---------- */

.ui-growl-item-container {
	border-radius: 6px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .2);
}

.ui-messages > div, .ui-message {
	border-radius: 4px;
}

/* ---------- Carregando ---------- */

.loading {
	background-color: rgba(15, 30, 50, .35);
}

.loading-content {
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
}

/* Tabelas com rolagem: o cabeçalho clonado no corpo serve só para alinhar as colunas */
.ui-datatable-scrollable-body > table > thead th {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	height: 0 !important;
	line-height: 0 !important;
	font-size: 0 !important;
	border-top: none !important;
	border-bottom: none !important;
	overflow: hidden;
}

.ui-datatable-scrollable-header, .ui-datatable-scrollable-header-box,
.ui-datatable-scrollable-footer, .ui-datatable-scrollable-footer-box {
	background: #f5f7fa !important;
	border-color: #e1e5ea !important;
}

/* Linhas canceladas / inativas (estilos definidos em cada tela) */
.ui-datatable-data > tr.notaCancelada, .ui-datatable-data > tr.cancelado, .ui-datatable-data > tr.inativo {
	background: #fdecea !important;
}

.ui-datatable-data > tr.notaCancelada > td, .ui-datatable-data > tr.cancelado > td, .ui-datatable-data > tr.inativo > td {
	background: transparent !important;
	color: #a93226 !important;
}

.ui-datatable-data > tr.notaCancelada > td:first-child, .ui-datatable-data > tr.cancelado > td:first-child, .ui-datatable-data > tr.inativo > td:first-child {
	box-shadow: inset 3px 0 0 #c0392b;
}

.ui-datatable-data > tr.notaCancelada.ui-state-highlight, .ui-datatable-data > tr.cancelado.ui-state-highlight, .ui-datatable-data > tr.inativo.ui-state-highlight {
	background: #f5c6c0 !important;
}

/* Assistente em etapas (p:wizard, ex.: pré-cadastro) */
.ui-wizard-step-titles {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 12px 0;
	padding: 0;
}

.ui-wizard-step-titles li.ui-wizard-step-title {
	float: none;
	margin: 0;
	padding: 8px 14px;
	border: 1px solid #dde1e6;
	border-radius: 16px;
	background: #fff !important;
	color: #666;
	font-size: 13px;
}

.ui-wizard-step-titles li.ui-wizard-step-title.ui-state-highlight {
	background: #0b5394 !important;
	border-color: #0b5394;
	color: #fff;
	font-weight: bold;
}

.ui-wizard-navbar .ui-button {
	min-width: 90px;
}
