/* ==========================================================================
   Caldo — Styles pages "Se connecter" / "Créer un compte"
   À ajuster : couleurs, polices et espacements pour coller exactement
   à la charte graphique Caldo.
   ========================================================================== */

:root {
	--caldo-brown: #3b2417;
	--caldo-brown-dark: #2c1a10;
	--caldo-cream: #f4efe3;
	--caldo-cream-light: #faf8f2;
	--caldo-border: #d8cdb8;
	--caldo-text: #3b2417;
	--caldo-text-light: #7a6a58;
	--caldo-error: #b3261e;

	--caldo-font-heading: 'Playfair Display', Georgia, serif;
	--caldo-font-body: 'Jost', 'Helvetica Neue', Arial, sans-serif;
}

.caldo-account-wrapper {
	max-width: 1160px;
	margin: 40px auto;
	padding: 0 20px;
	font-family: var(--caldo-font-body);
	color: var(--caldo-text);
}

/* --- Onglets haut de page --- */
.caldo-account-tabs {
	display: flex;
	gap: 24px;
	margin-bottom: 32px;
	border-bottom: 1px solid var(--caldo-border);
}

.caldo-tab-btn {
	background: none;
	border: none;
	padding: 12px 4px;
	font-family: var(--caldo-font-body);
	font-size: 14px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--caldo-text-light);
	cursor: pointer;
	border-bottom: 2px solid transparent;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.caldo-tab-btn:hover {
	color: var(--caldo-brown);
}

.caldo-tab-btn.is-active {
	color: var(--caldo-brown);
	border-bottom-color: var(--caldo-brown);
}

/* --- Panneaux --- */
.caldo-tab-panel {
	display: none;
}

.caldo-tab-panel.is-active {
	display: block;
}

.caldo-panel-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 48px;
	align-items: start;
	background: var(--caldo-cream);
	border-radius: 4px;
	overflow: hidden;
}

@media (max-width: 782px) {
	.caldo-panel-grid {
		grid-template-columns: 1fr;
	}
}

.caldo-form-col {
	background: #fff;
	padding: 48px 40px;
}

.caldo-info-col {
	padding: 48px 40px;
}

.caldo-title {
	font-family: var(--caldo-font-heading);
	font-style: italic;
	font-size: 34px;
	font-weight: 500;
	margin: 0 0 32px;
	color: var(--caldo-brown);
}

.caldo-info-col h2 {
	font-family: var(--caldo-font-heading);
	font-style: italic;
	font-size: 26px;
	font-weight: 500;
	margin: 0 0 24px;
	color: var(--caldo-brown);
}

/* --- Champs de formulaire (style "underline") --- */
.caldo-form .form-row {
	margin: 0 0 22px;
}

.caldo-form .form-row-first,
.caldo-form .form-row-last {
	display: inline-block;
	width: 48%;
}

.caldo-form .form-row-first {
	margin-right: 4%;
}

.caldo-form label {
	display: block;
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--caldo-text-light);
	margin-bottom: 8px;
}

.caldo-form .input-text,
.caldo-form input[type="text"],
.caldo-form input[type="email"],
.caldo-form input[type="password"],
.caldo-form input[type="tel"],
.caldo-form input[type="date"] {
	width: 100%;
	border: none;
	border-bottom: 1px solid var(--caldo-border);
	background: transparent;
	padding: 6px 2px;
	font-size: 15px;
	font-family: var(--caldo-font-body);
	color: var(--caldo-text);
	outline: none;
	transition: border-color 0.2s ease;
}

.caldo-form .input-text:focus {
	border-bottom-color: var(--caldo-brown);
}

.caldo-form .required {
	color: var(--caldo-error);
}

/* --- Boutons --- */
.caldo-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--caldo-brown);
	color: #fff !important;
	border: none;
	border-radius: 24px;
	padding: 12px 28px;
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s ease;
}

.caldo-btn:hover {
	background: var(--caldo-brown-dark);
}

.caldo-arrow {
	font-size: 16px;
}

.caldo-link-btn {
	background: none;
	border: none;
	padding: 0;
	color: var(--caldo-brown);
	text-decoration: underline;
	cursor: pointer;
	font-size: inherit;
	font-family: inherit;
}

/* --- Ligne "se souvenir de moi" / bouton --- */
.caldo-form-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
}

.caldo-remember {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--caldo-text-light);
	text-transform: none;
}

.caldo-lost-password {
	margin-top: 16px;
	font-size: 13px;
}

.caldo-lost-password a {
	color: var(--caldo-text-light);
	text-decoration: underline;
}

/* --- Toggle particulier / entreprise --- */
.caldo-account-type {
	display: flex;
	gap: 24px;
	margin-bottom: 28px;
	font-size: 14px;
}

.caldo-account-type label {
	display: flex;
	align-items: center;
	gap: 6px;
	text-transform: none;
	cursor: pointer;
}

.caldo-civility {
	display: flex;
	gap: 20px;
	margin-bottom: 20px;
	font-size: 13px;
}

.caldo-civility label {
	display: flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
}

/* --- Groupes de champs affichés/masqués selon le type de compte --- */
.caldo-field-group {
	display: none;
}

.caldo-field-group.is-visible {
	display: block;
}

/* --- Préférences (checkboxes) --- */
.caldo-preferences {
	border: none;
	padding: 0;
	margin: 0 0 24px;
}

.caldo-preferences legend {
	font-size: 11px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--caldo-text-light);
	margin-bottom: 10px;
	padding: 0;
}

.caldo-preferences label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	text-transform: none;
	margin-bottom: 8px;
	cursor: pointer;
}

/* --- RGPD --- */
.caldo-gdpr label {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 12px;
	text-transform: none;
	line-height: 1.5;
	color: var(--caldo-text-light);
}

.caldo-gdpr a {
	color: var(--caldo-brown);
}

.caldo-note {
	font-size: 12px;
	color: var(--caldo-text-light);
	margin-bottom: 20px;
}

/* --- Colonne info : avantages / bloc pro --- */
.caldo-perk {
	margin-bottom: 22px;
}

.caldo-perk h3 {
	font-size: 13px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	margin: 0 0 6px;
	color: var(--caldo-brown);
}

.caldo-perk p,
.caldo-info-particulier p,
.caldo-info-entreprise p {
	font-size: 14px;
	line-height: 1.6;
	color: var(--caldo-text-light);
	margin: 0 0 12px;
}

.caldo-info-entreprise ul {
	margin: 0 0 20px;
	padding-left: 18px;
}

.caldo-info-entreprise li {
	font-size: 14px;
	line-height: 1.7;
	color: var(--caldo-text-light);
}

/* --- Icône + texte d'intro (colonne pro) --- */
.caldo-icon-line {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.caldo-icon {
	flex: 0 0 auto;
	font-size: 18px;
	line-height: 1.5;
}

.caldo-perk-list li {
	font-weight: 600;
	color: var(--caldo-brown);
}

/* --- Bloc "Abonnement (optionnel)" déplacé dans la colonne droite --- */
.caldo-subscription-block {
	margin-top: 40px;
	padding-top: 32px;
	border-top: 1px solid var(--caldo-border);
}

.caldo-subscription-block h2 {
	margin-bottom: 8px;
}

.caldo-subscription-block > p {
	margin-bottom: 24px;
}

.caldo-subscription-block .caldo-preferences {
	margin-bottom: 28px;
}

.caldo-subscribe-checkbox label {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-size: 14px;
	text-transform: none;
	cursor: pointer;
	color: var(--caldo-brown);
}

.caldo-cta-row {
	margin-top: 32px;
	font-size: 14px;
	color: var(--caldo-text-light);
}

/* --- Messages d'erreur WooCommerce --- */
.caldo-account-wrapper .woocommerce-error {
	background: #fff;
	border-left: 3px solid var(--caldo-error);
	padding: 14px 18px;
	margin-bottom: 24px;
	font-size: 13px;
	list-style: none;
}