/**
 * Lista de Presença — Câmara Municipal de Peixe-Boi
 *
 * Todo o CSS é escopado em .lpcmpb: nenhuma regra atinge body, :root, table,
 * th, td, label, select ou a fora desse escopo.
 *
 * Espaçamentos seguem uma escala fixa de 4px (--lpcmpb-sp-*). Nenhum valor
 * de margem ou padding é definido fora dela.
 *
 * Algumas propriedades de layout usam !important porque temas costumam impor
 * regras genéricas a label, select, input e button dentro do conteúdo do post,
 * com especificidade igual ou maior. Elas ficam restritas a display, largura,
 * float e altura — nada que afete o resto da página.
 */

.lpcmpb {
	/* Escala de espaçamento */
	--lpcmpb-sp-1: 3px;
	--lpcmpb-sp-2: 6px;
	--lpcmpb-sp-3: 9px;
	--lpcmpb-sp-4: 12px;
	--lpcmpb-sp-5: 18px;
	--lpcmpb-sp-6: 24px;

	/* Cores */
	--lpcmpb-card: #ffffff;
	--lpcmpb-ink: #16202b;
	--lpcmpb-muted: #66768a;
	--lpcmpb-line: #e2e7ee;
	--lpcmpb-line-soft: #f0f3f7;
	--lpcmpb-accent: #1f6feb;
	--lpcmpb-accent-soft: #e8f0fe;
	--lpcmpb-zebra: #fafbfd;

	/* Raios */
	--lpcmpb-radius: 10px;

	box-sizing: border-box;
	color: var(--lpcmpb-ink);
	font-size: 15px;
	line-height: 1.5;
	margin: 0 0 var(--lpcmpb-sp-5);
}

.lpcmpb *,
.lpcmpb *::before,
.lpcmpb *::after {
	box-sizing: inherit;
}

.lpcmpb .lpcmpb__sub {
	color: var(--lpcmpb-muted);
	font-size: 14px;
	margin: 0 0 var(--lpcmpb-sp-4);
}

/* ---------- Painel de filtros ---------- */

.lpcmpb .lpcmpb__panel {
	background: var(--lpcmpb-card);
	border: 1px solid var(--lpcmpb-line);
	border-radius: var(--lpcmpb-radius);
	margin: 0 0 var(--lpcmpb-sp-4);
	padding: var(--lpcmpb-sp-4);
}

.lpcmpb .lpcmpb__filters {
	align-items: end;
	display: grid !important;
	gap: var(--lpcmpb-sp-4);
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	margin: 0;
	padding: 0;
}

.lpcmpb .lpcmpb__field {
	margin: 0;
	min-width: 0;
	padding: 0;
}

.lpcmpb .lpcmpb__field label {
	clear: none !important;
	color: var(--lpcmpb-muted);
	display: block !important;
	float: none !important;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.3;
	margin: 0 0 var(--lpcmpb-sp-2) !important;
	padding: 0;
	text-transform: uppercase;
	width: auto !important;
}

.lpcmpb .lpcmpb__field select,
.lpcmpb .lpcmpb__field input[type="search"] {
	background-color: #ffffff;
	background-image: none;
	border: 1px solid var(--lpcmpb-line);
	border-radius: var(--lpcmpb-radius);
	box-shadow: none;
	color: var(--lpcmpb-ink);
	display: block !important;
	float: none !important;
	font-family: inherit;
	font-size: 14px;
	height: auto !important;
	line-height: 1.4;
	margin: 0 !important;
	max-width: 100% !important;
	min-height: 0;
	padding: var(--lpcmpb-sp-3);
	width: 100% !important;
}

.lpcmpb .lpcmpb__field select:focus,
.lpcmpb .lpcmpb__field input[type="search"]:focus {
	border-color: var(--lpcmpb-accent);
	box-shadow: 0 0 0 3px var(--lpcmpb-accent-soft);
	outline: none;
}

.lpcmpb .lpcmpb__actions {
	align-items: stretch;
	display: flex !important;
	flex-wrap: wrap;
	gap: var(--lpcmpb-sp-2);
}

.lpcmpb .lpcmpb__export {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: var(--lpcmpb-sp-1);
}

.lpcmpb .lpcmpb__export-rotulo {
	color: var(--lpcmpb-muted);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.03em;
	margin-right: var(--lpcmpb-sp-1);
	text-transform: uppercase;
}

.lpcmpb .lpcmpb__btn--mini {
	font-size: 13px;
	padding: var(--lpcmpb-sp-2) var(--lpcmpb-sp-3);
}

.lpcmpb .lpcmpb__btn {
	background: #ffffff;
	border: 1px solid var(--lpcmpb-line);
	border-radius: var(--lpcmpb-radius);
	box-shadow: none;
	color: var(--lpcmpb-ink);
	cursor: pointer;
	display: inline-block;
	float: none !important;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	height: auto;
	letter-spacing: normal;
	line-height: 1.4;
	margin: 0;
	padding: var(--lpcmpb-sp-3) var(--lpcmpb-sp-4);
	text-shadow: none;
	text-transform: none;
	white-space: nowrap;
	width: auto;
}

.lpcmpb .lpcmpb__btn:hover,
.lpcmpb .lpcmpb__btn:focus {
	background: var(--lpcmpb-zebra);
	color: var(--lpcmpb-ink);
}

.lpcmpb .lpcmpb__btn--primary {
	background: var(--lpcmpb-accent);
	border-color: var(--lpcmpb-accent);
	color: #ffffff;
}

.lpcmpb .lpcmpb__btn--primary:hover,
.lpcmpb .lpcmpb__btn--primary:focus {
	background: #1a5fd0;
	border-color: #1a5fd0;
	color: #ffffff;
}

.lpcmpb .lpcmpb__count {
	color: var(--lpcmpb-muted);
	font-size: 14px;
	margin: 0 0 var(--lpcmpb-sp-3);
}

/* ---------- Tabela ---------- */

.lpcmpb .lpcmpb__tablewrap {
	background: var(--lpcmpb-card);
	border: 1px solid var(--lpcmpb-line);
	border-radius: var(--lpcmpb-radius);
	max-width: 100%;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
}

.lpcmpb .lpcmpb__table {
	background: transparent;
	border: 0 !important;
	border-collapse: collapse !important;
	border-spacing: 0;
	font-size: 14px;
	margin: 0 !important;
	max-width: 100%;
	/* Larguras vêm do colgroup. Com layout fixo o navegador não expande a
	   tabela para acomodar conteúdo longo, então ela sempre cabe no cartão. */
	table-layout: fixed;
	width: 100%;
}

.lpcmpb .lpcmpb__table thead th {
	background: var(--lpcmpb-zebra);
	border: 0 !important;
	border-bottom: 1px solid var(--lpcmpb-line) !important;
	color: var(--lpcmpb-muted);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.03em;
	padding: var(--lpcmpb-sp-3) var(--lpcmpb-sp-2);
	text-align: center;
	text-transform: uppercase;
	-webkit-user-select: none;
	user-select: none;
	white-space: nowrap;
}

/* Só as colunas ordenáveis convidam ao clique. "Documento" indicava ação
   inexistente com cursor de ponteiro e realce ao passar o mouse. */
.lpcmpb .lpcmpb__table thead th[data-sort] {
	cursor: pointer;
}

.lpcmpb .lpcmpb__table thead th[data-sort]:hover {
	color: var(--lpcmpb-ink);
}

.lpcmpb .lpcmpb__table thead th.lpcmpb__th-estatico {
	cursor: default;
}

.lpcmpb .lpcmpb__table thead th span {
	font-size: 10px;
	margin-left: var(--lpcmpb-sp-1);
	opacity: 0.35;
}

.lpcmpb .lpcmpb__table thead th[aria-sort] span {
	opacity: 1;
}

.lpcmpb .lpcmpb__table tbody tr,
.lpcmpb .lpcmpb__table tbody tr:nth-child(odd),
.lpcmpb .lpcmpb__table tbody tr:nth-child(even) {
	background: transparent;
}

.lpcmpb .lpcmpb__table tbody td {
	background: transparent;
	border: 0 !important;
	border-bottom: 1px solid var(--lpcmpb-line-soft) !important;
	color: var(--lpcmpb-ink);
	overflow-wrap: break-word;
	padding: var(--lpcmpb-sp-3) var(--lpcmpb-sp-2);
	text-align: center;
	vertical-align: middle;
	word-break: normal;
}

.lpcmpb .lpcmpb__table tbody tr:last-child td {
	border-bottom: 0 !important;
}

.lpcmpb .lpcmpb__table tbody tr:hover td {
	background: var(--lpcmpb-zebra);
}

.lpcmpb .lpcmpb__ord {
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.lpcmpb .lpcmpb__num {
	font-variant-numeric: tabular-nums;
	font-weight: 700;
	white-space: nowrap;
}

.lpcmpb .lpcmpb__na {
	color: #9aa8b8;
	font-style: italic;
	font-weight: 400;
}

.lpcmpb .lpcmpb__tag {
	border-radius: 999px;
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.6;
	max-width: 100%;
	padding: var(--lpcmpb-sp-1) var(--lpcmpb-sp-3);
	white-space: normal;
}

.lpcmpb .lpcmpb__tag--ordinaria { background: var(--lpcmpb-accent-soft); color: #1a4fb4; }
.lpcmpb .lpcmpb__tag--extraordinaria { background: #fdecec; color: #b42318; }
.lpcmpb .lpcmpb__tag--solene { background: #eaf7ee; color: #116b31; }
.lpcmpb .lpcmpb__tag--outro { background: #f0f2f5; color: #5a6a7d; }

.lpcmpb .lpcmpb__obs {
	color: #b54708;
	display: block;
	font-size: 12px;
	line-height: 1.4;
	margin: var(--lpcmpb-sp-1) auto 0;
	max-width: 260px;
}

.lpcmpb .lpcmpb__link {
	box-shadow: none;
	color: var(--lpcmpb-accent);
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
}

.lpcmpb .lpcmpb__link:hover,
.lpcmpb .lpcmpb__link:focus {
	color: var(--lpcmpb-accent);
	text-decoration: underline;
}

.lpcmpb .lpcmpb__empty {
	color: var(--lpcmpb-muted);
	margin: 0;
	padding: var(--lpcmpb-sp-6) var(--lpcmpb-sp-4);
	text-align: center;
}

/* Aviso exibido só para administradores; fica fora do escopo .lpcmpb,
   por isso não usa as variáveis de espaçamento. */
.lpcmpb-erro {
	background: #fdecec;
	border-left: 4px solid #b42318;
	color: #b42318;
	padding: 12px 16px;
}

@media (max-width: 782px) {
	.lpcmpb .lpcmpb__filters {
		grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
		gap: var(--lpcmpb-sp-3);
	}
}

@media (max-width: 640px) {
	.lpcmpb .lpcmpb__panel {
		padding: var(--lpcmpb-sp-3);
	}

	.lpcmpb .lpcmpb__table thead th,
	.lpcmpb .lpcmpb__table tbody td {
		font-size: 13px;
		padding: var(--lpcmpb-sp-3);
	}

	.lpcmpb .lpcmpb__obs {
		max-width: 220px;
	}
}

/* ---------- Barra de contagem e ação ---------- */

.lpcmpb .lpcmpb__bar {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: var(--lpcmpb-sp-3);
	justify-content: space-between;
	margin: 0 0 var(--lpcmpb-sp-3);
}

.lpcmpb .lpcmpb__bar .lpcmpb__count {
	margin: 0;
}

/* ---------- Avisos de operação ---------- */

.lpcmpb .lpcmpb__aviso {
	border-left: 4px solid var(--lpcmpb-line);
	border-radius: var(--lpcmpb-radius);
	font-size: 14px;
	margin: 0 0 var(--lpcmpb-sp-3);
	padding: var(--lpcmpb-sp-3) var(--lpcmpb-sp-4);
}

.lpcmpb .lpcmpb__aviso--ok {
	background: #eaf7ee;
	border-left-color: #116b31;
	color: #116b31;
}

.lpcmpb .lpcmpb__aviso--erro {
	background: #fdecec;
	border-left-color: #b42318;
	color: #b42318;
}

.lpcmpb .lpcmpb__aviso--info {
	background: var(--lpcmpb-accent-soft);
	border-left-color: var(--lpcmpb-accent);
	color: #1a4fb4;
}

/* ---------- Ações por linha ---------- */

/* ---------- Ações na linha ---------- */

/* Ficam sob a data, como no painel do WordPress. Discretas o bastante para
   não competir com o dado, e sem alterar o número de colunas — a tabela é a
   mesma para quem só consulta e para quem edita. */
.lpcmpb .lpcmpb__cel-data {
	white-space: nowrap;
}

.lpcmpb .lpcmpb__rowactions {
	align-items: center;
	display: flex;
	gap: var(--lpcmpb-sp-1);
	justify-content: center;
	margin-top: 2px;
	opacity: 0.55;
	transition: opacity 0.15s ease;
}

.lpcmpb .lpcmpb__table tbody tr:hover .lpcmpb__rowactions,
.lpcmpb .lpcmpb__rowactions:focus-within {
	opacity: 1;
}

.lpcmpb .lpcmpb__acao {
	background: none;
	border: 0;
	border-radius: 3px;
	color: var(--lpcmpb-muted);
	cursor: pointer;
	font-family: inherit;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.3;
	margin: 0;
	padding: 1px 2px;
	text-transform: none;
	width: auto;
}

.lpcmpb .lpcmpb__acao:hover,
.lpcmpb .lpcmpb__acao:focus {
	background: none;
	color: var(--lpcmpb-accent);
	text-decoration: underline;
}

.lpcmpb .lpcmpb__acao--perigo:hover,
.lpcmpb .lpcmpb__acao--perigo:focus {
	color: #b42318;
}

.lpcmpb .lpcmpb__acao-sep {
	color: #c3ccd8;
	font-size: 10px;
}

/* ---------- Paginação ---------- */

.lpcmpb .lpcmpb__pager {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: var(--lpcmpb-sp-1);
	justify-content: center;
	margin: var(--lpcmpb-sp-4) 0 0;
}

.lpcmpb .lpcmpb__pg {
	background: #ffffff;
	border: 1px solid var(--lpcmpb-line);
	border-radius: 8px;
	color: var(--lpcmpb-ink);
	cursor: pointer;
	font-family: inherit;
	font-size: 14px;
	font-variant-numeric: tabular-nums;
	line-height: 1.4;
	margin: 0;
	min-width: 38px;
	padding: var(--lpcmpb-sp-2) var(--lpcmpb-sp-3);
	text-align: center;
	text-transform: none;
	width: auto;
}

.lpcmpb .lpcmpb__pg:hover:not([disabled]),
.lpcmpb .lpcmpb__pg:focus:not([disabled]) {
	background: var(--lpcmpb-zebra);
	border-color: var(--lpcmpb-accent);
}

.lpcmpb .lpcmpb__pg.is-atual {
	background: var(--lpcmpb-accent);
	border-color: var(--lpcmpb-accent);
	color: #ffffff;
	font-weight: 700;
}

.lpcmpb .lpcmpb__pg[disabled] {
	cursor: default;
	opacity: 0.4;
}

.lpcmpb .lpcmpb__pg-sep {
	color: var(--lpcmpb-muted);
	padding: 0 var(--lpcmpb-sp-1);
}

/* ---------- Formulário em janela ---------- */

.lpcmpb__modal {
	align-items: flex-start;
	background: rgba(16, 32, 43, 0.55);
	bottom: 0;
	display: flex;
	justify-content: center;
	left: 0;
	overflow-y: auto;
	padding: 24px 16px;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 999999;
}

.lpcmpb__modal-caixa {
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 20px 60px rgba(16, 32, 43, 0.3);
	box-sizing: border-box;
	color: #16202b;
	font-size: 15px;
	max-width: 520px;
	padding: 24px;
	width: 100%;
}

.lpcmpb__modal-caixa *,
.lpcmpb__modal-caixa *::before,
.lpcmpb__modal-caixa *::after {
	box-sizing: border-box;
}

.lpcmpb__modal-titulo {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0 0 16px;
	padding: 0;
}

.lpcmpb__form-row {
	margin: 0 0 16px;
}

.lpcmpb__form-row label {
	color: #66768a;
	display: block !important;
	float: none !important;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.04em;
	margin: 0 0 8px !important;
	text-transform: uppercase;
	width: auto !important;
}

.lpcmpb__form-row input,
.lpcmpb__form-row select {
	background-color: #ffffff;
	border: 1px solid #e2e7ee;
	border-radius: 10px;
	color: #16202b;
	display: block !important;
	font-family: inherit;
	font-size: 14px;
	height: auto !important;
	line-height: 1.4;
	margin: 0 !important;
	max-width: 100% !important;
	padding: 12px;
	width: 100% !important;
}

.lpcmpb__form-row input:focus,
.lpcmpb__form-row select:focus {
	border-color: #1f6feb;
	box-shadow: 0 0 0 3px #e8f0fe;
	outline: none;
}

.lpcmpb__dica {
	color: #66768a;
	display: block;
	font-size: 12px;
	line-height: 1.4;
	margin: 8px 0 0;
}

.lpcmpb__form-erro {
	background: #fdecec;
	border-left: 4px solid #b42318;
	border-radius: 8px;
	color: #b42318;
	font-size: 13px;
	margin: 0 0 16px;
	padding: 12px;
}

.lpcmpb__form-acoes {
	display: flex;
	gap: 8px;
	justify-content: flex-end;
	margin: 24px 0 0;
}

.lpcmpb__form-acoes .lpcmpb__btn {
	background: #ffffff;
	border: 1px solid #e2e7ee;
	border-radius: 10px;
	color: #16202b;
	cursor: pointer;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	padding: 12px 16px;
	text-transform: none;
	width: auto;
}

.lpcmpb__form-acoes .lpcmpb__btn--primary {
	background: #1f6feb;
	border-color: #1f6feb;
	color: #ffffff;
}

.lpcmpb__form-acoes .lpcmpb__btn[disabled] {
	cursor: default;
	opacity: 0.6;
}

@media (max-width: 640px) {
	.lpcmpb .lpcmpb__bar {
		align-items: stretch;
		flex-direction: column;
	}

	.lpcmpb__modal {
		padding: 12px;
	}

	.lpcmpb__modal-caixa {
		padding: 16px;
	}
}

/* ---------- Campo-armadilha ---------- */

/* Fica fora da tela em vez de display:none: leitores automáticos costumam
   ignorar elementos ocultos por display, mas preenchem os que existem no DOM.
   aria-hidden e tabindex garantem que nenhum usuário real o alcance. */
.lpcmpb__hp {
	height: 1px;
	left: -9999px;
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
	position: absolute;
	top: -9999px;
	width: 1px;
}