/* ============================================================
   Creches 2027 — CSS Público
   ============================================================ */
:root {
	--c27-primary: #1565c0;
	--c27-primary-dark: #0d47a1;
	--c27-green: #2e7d32;
	--c27-orange: #ef6c00;
	--c27-bg: #f4f6f9;
	--c27-card: #ffffff;
	--c27-text: #1d2b3a;
	--c27-muted: #64748b;
	--c27-border: #dbe3ec;
	--c27-radius: 12px;
	--c27-shadow: 0 4px 18px rgba(15, 42, 66, .08);
}

.c27-wrap {
	max-width: 960px;
	margin: 24px auto;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: var(--c27-text);
	background: var(--c27-bg);
	padding: 20px;
	border-radius: var(--c27-radius);
	box-sizing: border-box;
}
.c27-wrap *, .c27-wrap *::before, .c27-wrap *::after { box-sizing: border-box; }

/* Cabeçalho */
.c27-header { text-align: center; margin-bottom: 24px; }
.c27-header h1 {
	font-size: 26px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .5px;
	margin: 0 0 6px;
}
.c27-header .c27-sub { font-weight: 500; color: var(--c27-muted); margin: 0; }

/* Cards */
.c27-card {
	background: var(--c27-card);
	border: 1px solid var(--c27-border);
	border-radius: var(--c27-radius);
	box-shadow: var(--c27-shadow);
	padding: 20px;
	margin-bottom: 18px;
}
.c27-card legend {
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .4px;
	padding: 0 8px;
	color: var(--c27-primary-dark);
}
.c27-card fieldset, fieldset.c27-card { min-width: 0; }
.c27-card-info { border-left: 5px solid var(--c27-primary); }
.c27-card-info h3 { margin: 0 0 8px; font-size: 17px; }
.c27-card-info p { margin: 0; line-height: 1.6; color: #33475b; }
.c27-card-lgpd { border-left: 5px solid var(--c27-green); background: #f4faf4; }

/* Grid de campos */
.c27-grid { display: grid; gap: 14px; }
.c27-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.c27-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.c27-field { display: flex; flex-direction: column; }
.c27-field-full { grid-column: 1 / -1; }
.c27-field-3 { grid-column: span 1; }

.c27-field label { font-size: 13px; font-weight: 600; margin-bottom: 5px; }
.c27-req { color: #d32f2f; }

.c27-field input[type="text"],
.c27-field input[type="email"],
.c27-field input[type="number"],
.c27-field select,
.c27-tipo-campos input,
.c27-tipo-campos select {
	width: 100%;
	padding: 10px 12px;
	border: 1.5px solid var(--c27-border);
	border-radius: 8px;
	font-size: 14px;
	background: #fff;
	transition: border-color .15s, box-shadow .15s;
}
.c27-field input:focus,
.c27-field select:focus,
.c27-tipo-campos input:focus {
	outline: none;
	border-color: var(--c27-primary);
	box-shadow: 0 0 0 3px rgba(21, 101, 192, .12);
}
.c27-field input[readonly] { background: #eef2f7; color: #43536b; }
.c27-field input:disabled, .c27-field select:disabled { background: #f1f5f9; color: #94a3b8; }

/* Combobox pesquisável — UF, Naturalidade e Unidade Escolar. */
.c27-combobox-native {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
}
.c27-combobox { position: relative; width: 100%; min-width: 0; }
.c27-combobox-control { position: relative; display: flex; width: 100%; }
.c27-combobox-input {
	display: block !important;
	width: 100% !important;
	height: 42px !important;
	min-height: 42px !important;
	padding: 0 42px 0 12px !important;
	border: 1.5px solid var(--c27-border) !important;
	border-radius: 8px !important;
	background: #fff !important;
	color: var(--c27-text) !important;
	font-size: 14px !important;
}
.c27-combobox-input:focus { border-color: var(--c27-primary) !important; box-shadow: 0 0 0 3px rgba(21,101,192,.12) !important; outline: 0 !important; }
.c27-combobox-input:disabled { background: #f1f5f9 !important; color: #94a3b8 !important; }
.c27-combobox-toggle {
	position: absolute; top: 1px; right: 1px; bottom: 1px; width: 39px; padding: 0;
	border: 0; border-left: 1px solid var(--c27-border); border-radius: 0 7px 7px 0;
	background: #f8fafc; color: #334155; cursor: pointer;
}
.c27-combobox-toggle:disabled { cursor: not-allowed; opacity: .55; }
.c27-combobox-list {
	position: absolute; top: calc(100% + 4px); right: 0; left: 0; z-index: 10000;
	max-height: 300px; margin: 0; padding: 5px; overflow-y: auto;
	border: 1px solid var(--c27-border); border-radius: 8px; background: #fff;
	box-shadow: 0 10px 28px rgba(15,42,66,.18);
}
.c27-combobox-list[hidden] { display: none !important; }
.c27-combobox-option { display: block; width: 100%; padding: 9px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--c27-text); text-align: left; cursor: pointer; }
.c27-combobox-option:hover, .c27-combobox-option.is-active { background: #e8f1fb; color: var(--c27-primary-dark); }
.c27-combobox-option[aria-selected="true"] { font-weight: 700; }
.c27-combobox-empty { padding: 10px; color: var(--c27-muted); font-size: 12px; }

.c27-hint { font-size: 12px; color: var(--c27-muted); margin-top: 4px; }

/* Checkboxes de declaração */
.c27-check {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 14px;
	line-height: 1.5;
	cursor: pointer;
	margin-bottom: 10px;
}
.c27-check input[type="checkbox"] {
	width: 18px; height: 18px;
	margin-top: 1px;
	accent-color: var(--c27-primary);
	flex-shrink: 0;
	cursor: pointer;
}

/* Critérios de prioridade — duas colunas */
.c27-criterios {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 20px;
	counter-reset: criterio;
}
.c27-crit {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	padding: 9px 11px;
	border: 1.5px solid var(--c27-border);
	border-radius: 8px;
	cursor: pointer;
	font-size: 13px;
	line-height: 1.4;
	transition: background .12s, border-color .12s;
	background: #fff;
	user-select: none;
}
.c27-crit:hover { border-color: #b9c8d8; }
.c27-crit input[type="checkbox"] {
	width: 17px; height: 17px;
	margin-top: 1px;
	accent-color: var(--c27-primary);
	flex-shrink: 0;
	cursor: pointer;
}
/* Estado visual vinculado ao próprio checkbox (nativo, sem depender de JS) */
.c27-crit:has(> input[type="checkbox"]:checked) {
	background: #e8f1fb;
	border-color: var(--c27-primary);
}
.c27-crit-num { font-weight: 700; color: var(--c27-primary-dark); flex-shrink: 0; }
.c27-crit-desc { color: #33475b; }

.c27-pontos-box {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 14px;
	padding: 10px 14px;
	background: #0d47a1;
	color: #fff;
	border-radius: 8px;
	font-size: 15px;
}
.c27-pontos-box strong { font-size: 20px; }

/* Pedido de vaga */
.c27-alert { margin-top: 14px; padding: 12px 14px; border-radius: 8px; font-size: 14px; line-height: 1.5; }
.c27-alert-warn { background: #fff6e5; border: 1px solid #f0c36d; color: #7a4b00; }
.c27-alert-ok { background: #e9f6ec; border: 1px solid #7cc78a; color: #1d5423; }
.c27-alert-erro { background: #fdecea; border: 1px solid #f2a9a2; color: #8f1d14; }

/* Botões */
.c27-actions { display: flex; gap: 12px; justify-content: center; margin-top: 8px; flex-wrap: wrap; }
.c27-btn {
	display: inline-block;
	padding: 12px 26px;
	border: none;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .4px;
	cursor: pointer;
	text-decoration: none;
	transition: transform .12s, box-shadow .12s, background .12s;
}
.c27-btn-primary { background: linear-gradient(135deg, var(--c27-primary), var(--c27-primary-dark)); color: #fff; box-shadow: 0 4px 12px rgba(13, 71, 161, .35); }
.c27-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(13, 71, 161, .45); }
.c27-btn-secondary { background: #fff; color: var(--c27-primary-dark); border: 1.5px solid var(--c27-primary); }
.c27-btn-secondary:hover { background: #eef4fc; }
.c27-btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }

/* Opções de consulta */
.c27-opcoes { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.c27-radio {
	display: flex; align-items: center; gap: 8px;
	padding: 10px 16px;
	border: 1.5px solid var(--c27-border);
	border-radius: 999px;
	font-size: 14px; font-weight: 600;
	cursor: pointer;
	transition: all .12s;
	background: #fff;
}
.c27-radio input[type="radio"] { accent-color: var(--c27-primary); width: 16px; height: 16px; margin: 0; }
.c27-radio:has(> input[type="radio"]:checked) {
	background: var(--c27-primary); border-color: var(--c27-primary); color: #fff;
}
.c27-tipo-campos { margin-bottom: 14px; }
.c27-tipo-campos label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 5px; }

/* Resultados */
.c27-resultado { margin-top: 18px; }
.c27-result-card { border-radius: var(--c27-radius); padding: 20px; font-size: 15px; line-height: 1.6; }
.c27-result-card h3 { margin: 0 0 10px; font-size: 18px; }
.c27-result-card.contemplado { background: #e9f6ec; border: 1.5px solid #7cc78a; }
.c27-result-card.espera { background: #fff6e5; border: 1.5px solid #f0c36d; }
.c27-result-card p { margin: 6px 0; }
.c27-result-card .c27-protocolo { font-size: 20px; font-weight: 800; letter-spacing: .5px; }

/* Barra de status do CPF */
#c27-cpf-status.ok { color: var(--c27-green); font-weight: 600; }
#c27-cpf-status.erro { color: #c62828; font-weight: 600; }
#c27-cpf-status.aviso { color: var(--c27-orange); font-weight: 600; }

/* Responsivo */
@media (max-width: 720px) {
	.c27-grid-2, .c27-grid-3 { grid-template-columns: 1fr; }
	.c27-criterios { grid-template-columns: 1fr; }
	.c27-header h1 { font-size: 20px; }
	.c27-wrap { padding: 12px; margin: 12px auto; }
	/* Filtros estilo accordion nos cards */
	.c27-card { padding: 14px; }
	.c27-actions { position: sticky; bottom: 10px; z-index: 5; }
}
.c27-result-card.expirado{background:#fdecec;border-color:#e5a3a3}.c27-historico{margin-top:12px}.c27-historico table{width:100%;border-collapse:collapse}.c27-historico td{border:1px solid #d9dee5;padding:6px}


/* Período de inscrições */
.c27-periodo-publico{width:100%;background:#07563f;border-radius:8px;padding:46px 24px;margin:24px 0;box-sizing:border-box;display:flex;justify-content:center;align-items:center;min-height:180px}
.c27-periodo-alerta{width:min(790px,100%);background:#fff1f2;border:1px solid #fda4af;border-left:5px solid #ef3340;border-radius:9px;padding:20px 24px;text-align:center;color:#991b1b;box-sizing:border-box}
.c27-periodo-alerta strong,.c27-periodo-alerta span{display:block}.c27-periodo-alerta strong{font-size:16px;font-weight:800;margin-bottom:5px}.c27-periodo-alerta span{font-size:16px;font-weight:700;line-height:1.35}
@media(max-width:600px){.c27-periodo-publico{padding:28px 14px;min-height:150px}.c27-periodo-alerta{padding:17px 14px}.c27-periodo-alerta strong,.c27-periodo-alerta span{font-size:14px}}

/* v2.3.1 — estado dinâmico do período público */
.c27-periodo-publico{max-width:1320px;margin:34px auto;padding:46px 24px;background:#21619f;border-radius:9px;box-sizing:border-box}.c27-periodo-alerta{max-width:830px;margin:0 auto;padding:20px 26px;text-align:center;background:#fff1f2;border:1px solid #fecdd3;border-left:5px solid #ef3340;border-radius:9px;color:#991b1b}.c27-periodo-alerta strong,.c27-periodo-alerta span{display:block}.c27-periodo-alerta strong{font-weight:800;margin-bottom:5px}.c27-periodo-alerta span{font-weight:700}

/* v2.3.2 — estado público, privacidade do CPF e integração com temas WordPress */
.c27-periodo-publico[hidden], #c27-cadastro[hidden], .c27-cpf-existing-alert[hidden]{display:none!important;}
.c27-periodo-publico{max-width:1320px!important;margin:34px auto!important;padding:46px 24px!important;background:#07563f!important;border-radius:9px!important;box-sizing:border-box!important;}
.c27-cpf-existing-alert{grid-column:1/-1;width:100%;box-sizing:border-box;margin:12px 0 2px;padding:15px 18px;border:1px solid #d7a4aa;border-left:5px solid #7b1e2b;border-radius:9px;background:#fff5f6;color:#7b1e2b;font-weight:800;line-height:1.55;overflow-wrap:anywhere;}
.c27-cpf-existing-alert a{color:#1565c0!important;font-weight:800!important;text-decoration:underline!important;}
body:has(#c27-cadastro) .entry-title,body:has(#c27-cadastro) .page-title,body:has(#c27-cadastro) .wp-block-post-title,body:has(#c27q-consulta) .entry-title,body:has(#c27q-consulta) .page-title,body:has(#c27q-consulta) .wp-block-post-title{display:none!important;}

/* v2.4.14 — integração com títulos e espaçamentos dos temas WordPress */
body.c27-public-plugin-page .c27-wordpress-page-title,
body.c27-public-plugin-page .c27-wordpress-title-block,
body:has(#c27-cadastro) .entry-header,
body:has(#c27-cadastro) .page-header,
body:has(#c27q-consulta) .entry-header,
body:has(#c27q-consulta) .page-header {
	display: none !important;
	margin: 0 !important;
	padding: 0 !important;
	min-height: 0 !important;
}
body.c27-public-plugin-page .entry-content,
body.c27-public-plugin-page .wp-block-post-content {
	margin-block-start: 0 !important;
	padding-top: 0 !important;
}
body.c27-public-plugin-page #c27-cadastro,
body.c27-public-plugin-page #c27q-consulta {
	margin-top: 2px !important;
}

/* v2.3.4 — link da consulta no aviso de período */
.c27-periodo-alerta #c27-periodo-consulta-link{display:inline!important;color:#0b63ce!important;font-weight:800!important;text-decoration:underline!important;margin-left:4px;}
.c27-periodo-alerta #c27-periodo-consulta-link:hover{color:#084b9a!important;}

/* v2.3.5 */
#c27-cadastro .c27-serie-compatibilidade[hidden]{display:none!important;}
#c27-cadastro input.c27-data-native{width:100%;min-width:0;box-sizing:border-box;}
#c27-cadastro .c27-cpf-existing-alert:not([hidden]){display:block!important;}
