/*
 * Ravolli — Conta fácil: apresentação v1.0.0
 * inc/ravolli-checkout-glass.php · Core: includes/ravolli-conta-facil.php
 *
 * 1. Bloco da confirmação do pedido (criar conta / acompanhar pedido).
 * 2. Aviso "Pronto" no topo de Minha conta.
 * 3. Aba de cadastro do modal de conta do Blocksy.
 *
 * Mobile-first, cantos retos, alvos ≥ 44px, tokens do theme.json.
 * Botão igual ao primário do site: marinho, texto branco, peso 600.
 */

.ravolli-account-block {
	--ra-navy: var(--wp--preset--color--brand-primary, #060e1e);
	--ra-gold: var(--wp--preset--color--accent-gold, #BC9C6D);
	--ra-line: var(--wp--preset--color--border-divider, #EBEBEB);
	--ra-text: var(--wp--preset--color--text-body, #606060);
	--ra-muted: var(--wp--preset--color--text-secondary, #737373);

	box-sizing: border-box;
	margin: 24px 0;
	padding: 24px 16px;
	background: #fff;
	border: 1px solid var(--ra-line);
	border-top: 2px solid var(--ra-gold);
	border-radius: 0;
	color: var(--ra-text);
}

@media (min-width: 768px) {
	.ravolli-account-block {
		padding: 32px;
	}
}

.ravolli-account-block__title {
	margin: 0 0 8px;
	font-family: var(--wp--preset--font-family--display, 'Lora', serif);
	font-size: 20px;
	line-height: 1.3;
	color: var(--ra-navy);
}

.ravolli-account-block__intro {
	margin: 0 0 16px;
}

.ravolli-account-block__error {
	margin: 0 0 16px;
	padding: 12px 16px;
	border-left: 3px solid #b3261e;
	background: #fdf3f2;
	color: #7a1a14;
}

.ravolli-account-block__actions {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

@media (min-width: 600px) {
	.ravolli-account-block__actions {
		flex-direction: row;
		flex-wrap: wrap;
	}
}

/* Botões — iguais aos do site */
.ravolli-account-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 48px;
	padding: 12px 24px;
	border: 1px solid var(--ra-navy, #060e1e);
	border-radius: 0;
	background: var(--ra-navy, #060e1e);
	color: #fff;
	font-family: var(--wp--preset--font-family--body, 'Source Serif 4', serif);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
}

.ravolli-account-button:hover,
.ravolli-account-button:focus-visible {
	background: #fff;
	color: var(--ra-navy, #060e1e);
}

.ravolli-account-button:focus-visible {
	outline: 2px solid var(--ra-gold, #BC9C6D);
	outline-offset: 2px;
}

.ravolli-account-button--ghost {
	background: transparent;
	color: var(--ra-navy, #060e1e);
}

.ravolli-account-button--ghost:hover,
.ravolli-account-button--ghost:focus-visible {
	background: var(--ra-navy, #060e1e);
	color: #fff;
}

/* Formulário de senha */
.ravolli-account-form {
	display: grid;
	gap: 12px;
}

.ravolli-account-form__label {
	font-weight: 600;
	color: var(--ra-navy);
}

.ravolli-account-form__password {
	display: flex;
	align-items: stretch;
}

.ravolli-account-form__password input {
	margin: 0;
	flex: 1;
	min-width: 0;
	min-height: 48px;
	padding: 0 16px;
	border: 1px solid var(--ra-muted);
	border-right: 0;
	border-radius: 0;
	background: #fff;
	font-size: 16px; /* evita zoom automático no iOS */
}

.ravolli-account-form__toggle {
	min-width: 88px;
	min-height: 48px;
	padding: 0 16px;
	border: 1px solid var(--ra-muted);
	border-radius: 0;
	background: #fff;
	color: var(--ra-navy);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.ravolli-account-form__help,
.ravolli-account-form__privacy {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--ra-muted);
}

.ravolli-account-form__privacy p {
	margin: 0;
}

/* Campo-armadilha: fora da tela, nunca visível. */
.ravolli-account-trap {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Aba de cadastro do modal do Blocksy */
.ct-account-modal .ct-register-form .input,
.ct-account-modal .ct-register-form input[type="text"],
.ct-account-modal .ct-register-form input[type="email"],
.ct-account-modal .ct-register-form input[type="password"] {
	min-height: 48px;
	border-radius: 0;
}

.ct-account-modal .ct-register-form .ct-button,
.ct-account-modal .ct-register-form button[type="submit"] {
	min-height: 48px;
	border-radius: 0;
}

.ct-account-modal .ct-register-form .woocommerce-privacy-policy-text,
.ct-account-modal .ct-register-form .woocommerce-privacy-policy-text p {
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--wp--preset--color--text-secondary, #737373);
}
