/* Consulta de Código Postal — estilos da ferramenta (form de pesquisa,
   tabs, cartões de resultado e tabelas). Tokens de cor/tipografia partilhados
   vêm do <style> inline da página (mesmos usados em page-pdm.php). */

.cp-tool {
	background: var(--c-band);
	border-block: 1px solid var(--c-svc-hero-border);
	padding-block: 46.8px 52.2px;
}

.cp-tool__col {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 19.8px;
	max-width: 720px;
}

.cp-tool__title { font-size: 40px; font-weight: 500; line-height: 45px; color: var(--c-ink); }
.cp-tool__lead { font-size: 15.3px; font-weight: 400; line-height: 26.3px; color: var(--c-slate); max-width: 620px; }

.cp-card {
	width: 100%;
	max-width: 780px;
	background: var(--c-white);
	border: 1px solid var(--c-svc-input-border);
	border-radius: var(--radius-xl);
	box-shadow: var(--sh-svc-form);
	overflow: hidden;
}

.cp-tabs {
	display: flex;
	border-bottom: 1px solid var(--c-svc-input-border);
}

.cp-tab {
	flex: 1 1 0;
	padding: 16.2px 18px;
	border: 0;
	background: var(--c-white);
	font-size: var(--fs-15);
	font-weight: 600;
	color: var(--c-slate);
	cursor: pointer;
	border-bottom: 2.7px solid transparent;
}

.cp-tab[aria-selected="true"] {
	color: var(--c-blue);
	border-bottom-color: var(--c-blue);
	background: var(--c-svc-card-bg);
}

.cp-panel { display: none; padding: 25.2px; }
.cp-panel.is-active { display: block; }

.cp-error-wrap { padding: 0 25.2px 25.2px; }

.cp-field { display: flex; flex-direction: column; gap: 7.2px; margin-bottom: 14.4px; }
.cp-field:last-of-type { margin-bottom: 0; }

.cp-field__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14.4px;
}

.cp-field__label { font-size: var(--fs-13); font-weight: 600; color: var(--c-ink); }
.cp-field__hint { font-size: var(--fs-12); font-weight: 400; color: var(--c-muted-2); }

.cp-input,
.cp-select {
	min-height: 43.2px;
	padding: 10.8px 14.4px;
	border: 1px solid var(--c-svc-input-border);
	border-radius: var(--radius-md);
	background: var(--c-svc-input-bg);
	font-size: var(--fs-15);
	color: var(--c-ink);
	width: 100%;
}

.cp-input::placeholder { color: var(--c-svc-input-placeholder); }
.cp-select:disabled { opacity: 0.6; cursor: not-allowed; }

.cp-cp-input {
	display: flex;
	align-items: center;
	gap: 9px;
}

.cp-cp-input .cp-input { max-width: 108px; text-align: center; letter-spacing: 1.8px; }
.cp-cp-input__sep { font-size: 18px; font-weight: 700; color: var(--c-crumb-sep); }

.cp-actions { margin-top: 18px; }
.cp-submit { width: 100%; }
.cp-submit[disabled] { opacity: 0.7; cursor: wait; }

.cp-error {
	margin-top: 12.6px;
	padding: 10.8px 14.4px;
	border-radius: var(--radius-md);
	background: #fdecec;
	border: 1px solid #f3b8b8;
	color: #a3231f;
	font-size: var(--fs-14);
	display: none;
}

.cp-error.is-visible { display: block; }

.cp-results {
	width: 100%;
	max-width: 780px;
	margin-top: 25.2px;
}

.cp-results:empty { margin-top: 0; }

.cp-results__notice {
	padding: 10.8px 14.4px;
	margin-bottom: 10.8px;
	border-radius: var(--radius-md);
	background: var(--c-svc-card-bg);
	border: 1px solid var(--c-svc-card-border);
	font-size: var(--fs-13);
	color: var(--c-body);
}

.cp-result-card {
	padding: 18px;
	margin-bottom: 12.6px;
	background: var(--c-white);
	border: 1px solid var(--c-svc-card-border);
	border-radius: var(--radius-lg);
	box-shadow: var(--sh-header);
}

.cp-result-card__lines {
	font-size: var(--fs-14);
	color: var(--c-slate);
	line-height: 20.7px;
}

.cp-result-card__code {
	margin-top: 7.2px;
	font-size: 20.7px;
	font-weight: 700;
	color: var(--c-blue-700);
}

.cp-table-wrap {
	width: 100%;
	overflow-x: auto;
	margin-bottom: 12.6px;
	border: 1px solid var(--c-svc-card-border);
	border-radius: var(--radius-lg);
}

.cp-table { width: 100%; border-collapse: collapse; font-size: var(--fs-13); }
.cp-table th,
.cp-table td { padding: 10.8px 14.4px; text-align: left; border-bottom: 1px solid var(--c-svc-list-divider); white-space: nowrap; }
.cp-table thead th { background: var(--c-svc-card-bg); color: var(--c-ink); font-weight: 600; }
.cp-table tbody tr:last-child td { border-bottom: 0; }

.cp-empty {
	padding: 18px;
	text-align: center;
	color: var(--c-muted-2);
	font-size: var(--fs-14);
}

@media (max-width: 768px) {
	.cp-tool__title { font-size: 26px; line-height: 30px; }
	.cp-field__row { grid-template-columns: 1fr; }
	.cp-tabs { flex-direction: column; }
}
