/*
 * Formulário de comentários dos posts (bloco core/comments, Fase 3.8).
 *
 * POR QUE ESTE ARQUIVO EXISTE: o bundle legado da HubSpot
 * (assets/legacy-css/zz-inline-theme-vars.css) traz, sem escopo nenhum, o CSS
 * de campo de formulário de uma das páginas-amostra:
 *
 *     form input[type='text'], form input[type='email'], ... form textarea {
 *         border: 1px none #d7d9e3;  <-- border-style: none
 *         padding: 10px;
 *     }
 *
 * Naquela página da HubSpot o formulário realmente não tinha borda. Como a
 * regra usa tags (especificidade 0,0,2), ela ganha do `:where(...)` (0,0,0)
 * com que o WordPress estiliza o bloco de comentários, e o resultado era
 * campo sem borda nenhuma -- invisível sobre o fundo branco. O campo "Site"
 * escapava e ficava com a borda padrão do navegador, porque a lista de
 * seletores da HubSpot não inclui input[type=url]: era essa a assimetria
 * visível na página.
 *
 * É a mesma família dos overrides globais tratados em
 * assets/chrome/legacy-overrides.css (`form { padding: 45px }`, `body
 * { font-size: 16px }`); o CF7 nunca sofreu com ela porque
 * assets/forms/cf7-form.css já casa mais forte (.wpcf7 input[type=...]).
 *
 * As medidas abaixo são as mesmas do cf7-form.css, para que os dois
 * formulários do site tenham o mesmo visual.
 */

/* (0,2,2) -- ganha do `form input[type=...]` (0,0,2) do bundle legado sem
   precisar de !important. */
.wp-block-post-comments-form .comment-form input[type="text"],
.wp-block-post-comments-form .comment-form input[type="email"],
.wp-block-post-comments-form .comment-form input[type="url"],
.wp-block-post-comments-form .comment-form textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 20px 32px;
	border: 1px solid #000;
	border-radius: 8px;
	background-color: #fff;
	font-family: var(--wp--preset--font-family--body, Georgia, "Times New Roman", Times, serif);
	font-size: 18px;
	line-height: 20.7px;
	color: var(--wp--preset--color--base-3, #09152B);
}

/* O tema pai (Twenty Twenty-Five) declara
   `border-color: var(--wp--preset--color--accent-6) !important` para estes
   campos. Esse preset não existe na paleta do tema filho, então hoje a
   declaração é inválida e o navegador a descarta -- mas ela venceria por
   !important se um dia `accent-6` passasse a existir. O !important aqui é a
   trava contra essa regressão silenciosa. */
.wp-block-post-comments-form .comment-form input[type="text"],
.wp-block-post-comments-form .comment-form input[type="email"],
.wp-block-post-comments-form .comment-form input[type="url"],
.wp-block-post-comments-form .comment-form textarea {
	border-color: #000 !important;
}

.wp-block-post-comments-form .comment-form textarea {
	height: 160px;
	border-radius: 4px;
	resize: vertical;
}

.wp-block-post-comments-form .comment-form input:focus,
.wp-block-post-comments-form .comment-form textarea:focus {
	outline: 2px solid var(--wp--preset--color--accent, #D9843B);
	outline-offset: 1px;
}

.wp-block-post-comments-form .comment-form input::placeholder,
.wp-block-post-comments-form .comment-form textarea::placeholder {
	color: #6b7280;
}

.wp-block-post-comments-form .comment-form label {
	display: block;
	margin-bottom: 8px;
	font-size: 18px;
	font-weight: 500;
	/* O bundle legado dá `form label { padding: 6px 0 }`; zerado aqui pelo
	   mesmo motivo registrado na Fase 6 para o CF7 (12px extras por rótulo). */
	padding: 0;
}

.wp-block-post-comments-form .comment-form p {
	margin-bottom: 32px;
}
