/* Disfrais - Espace Pro (page de connexion) */

body.woocommerce-account {
	--df-cream: #F8F3EA;
	--df-dark: #211D18;
	--df-gold: #C9973E;
	--df-gold-dark: #AD7F2E;
	--df-text: #2B2925;
	--df-text-muted: #6B655A;
}

/* Masque l'icône coq du thème (hors sujet pour Disfrais), centre l'en-tête.
   Le thème affiche .page-header en flexbox (colonne icône + titre) : text-align
   seul ne repositionne pas les enfants flex, il faut align-items/justify-content. */
body.woocommerce-account .page-header,
body.woocommerce-account .entry-header {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	width: 100%;
}
body.woocommerce-account .page-header > *,
body.woocommerce-account .entry-header > *,
body.woocommerce-account [itemprop="headline"] {
	text-align: center !important;
	width: auto !important;
	max-width: 100%;
}
body.woocommerce-account .page-header svg,
body.woocommerce-account .entry-header svg {
	display: none;
}
body.woocommerce-account .page-header::before,
body.woocommerce-account .entry-header::before {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	margin: 0 auto 12px;
	background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9973E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><rect x='4' y='11' width='16' height='10' rx='2'/><path d='M8 11V7a4 4 0 0 1 8 0v4'/></svg>") center / contain no-repeat;
}

/* --- Calage sur la maquette A (rendu réel vérifié) ---------------------------
   Le titre de page du thème est dans #sub-header > .meta-header ; il affiche
   un coq (.vamtam-logo) et pousse le h1 à gauche en grande Cormorant bleu nuit. */
body.woocommerce-account #sub-header .meta-header-inside,
body.woocommerce-account #sub-header .limit-wrapper {
	display: flex !important;
	justify-content: center !important;
	text-align: center !important;
}
body.woocommerce-account .page-header .vamtam-logo {
	display: none !important;
}
body.woocommerce-account .page-header h1,
body.woocommerce-account .page-header .entry-title {
	margin: 0 !important;
	font-size: 40px !important;
	color: var(--df-dark) !important;
	text-align: center !important;
}
/* header.css passe #sub-header en flex pour aligner le header du site ; sur la
   page de compte c'est le conteneur du titre de page, et en flex son enfant
   .meta-header se rétracte à la largeur du texte, collé à gauche. */
body.woocommerce-account #sub-header {
	display: block !important;
	padding-top: 40px !important;
	padding-bottom: 0 !important;
}
body.woocommerce-account #sub-header .meta-header {
	width: 100% !important;
}

/* Le thème redouble le titre d'onglet par un h4 "Connexion"/"Inscription"
   dans chaque colonne : les onglets suffisent. */
body.woocommerce-account #customer_login h4 {
	display: none !important;
}

/* Libellés au-dessus des champs (le thème les masque au profit de
   placeholders vides) et champs crème arrondis. */
body.woocommerce-account .woocommerce-form-row > label {
	display: block !important;
	position: static !important;
	opacity: 1 !important;
	height: auto !important;
	margin: 0 0 6px !important;
	text-align: left !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--df-text) !important;
}
body.woocommerce-account .woocommerce-form-row > label .required {
	color: var(--df-gold);
}
body.woocommerce-account .woocommerce-form input.input-text,
body.woocommerce-account .woocommerce-form input.woocommerce-Input {
	height: 46px !important;
	padding: 12px 14px !important;
	border: 1px solid rgba(0,0,0,.15) !important;
	border-radius: 6px !important;
	background: var(--df-cream) !important;
	box-shadow: none !important;
	font-size: 14px !important;
}
body.woocommerce-account .woocommerce-form input.input-text:focus {
	border-color: var(--df-gold) !important;
}
body.woocommerce-account .woocommerce-form-row {
	margin-bottom: 16px !important;
}
body.woocommerce-account .woocommerce-form-login__rememberme {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--df-text-muted);
}

/* Sous-titre explicatif sous "Espace Pro" */
.disfrais-login-intro {
	max-width: 480px;
	margin: 0 auto 30px;
	text-align: center;
	color: var(--df-text-muted);
	font-size: 15px;
}

/* Carte de connexion */
body.woocommerce-account #customer_login,
body.woocommerce-account .vamtam-tab-content {
	max-width: 480px;
	margin: 0 auto;
	background: #fff;
	border-radius: 10px;
	box-shadow: 0 10px 30px rgba(33,29,24,.08);
	padding: 40px;
}

/* Onglets Connexion / Inscription */
body.woocommerce-account ul.vamtam-tabs,
body.woocommerce-account .vamtam-tabs {
	display: flex;
	gap: 24px;
	justify-content: center;
	list-style: none;
	max-width: 480px;
	margin: 0 auto;
	padding: 0 0 16px;
	border-bottom: 1px solid rgba(0,0,0,.08);
}
body.woocommerce-account .vamtam-tab label {
	cursor: pointer;
	font-weight: 700;
	color: var(--df-text-muted);
	text-transform: uppercase;
	font-size: 13px;
	letter-spacing: .04em;
	padding-bottom: 12px;
}
body.woocommerce-account #login-tab:checked ~ * label[for="login-tab"],
body.woocommerce-account #register-tab:checked ~ * label[for="register-tab"],
body.woocommerce-account .vamtam-tab label.active,
body.woocommerce-account .vamtam-tab.active label {
	color: var(--df-gold-dark);
	border-bottom: 2px solid var(--df-gold);
}

/* Champs de formulaire */
body.woocommerce-account .woocommerce-form-row label {
	font-weight: 600;
	font-size: 13px;
	color: var(--df-text);
	margin-bottom: 6px;
	display: inline-block;
}
body.woocommerce-account .woocommerce-form input.input-text,
body.woocommerce-account .woocommerce-form input[type="text"],
body.woocommerce-account .woocommerce-form input[type="email"],
body.woocommerce-account .woocommerce-form input[type="password"] {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid rgba(0,0,0,.15);
	border-radius: 6px;
	background: var(--df-cream);
	font-size: 14px;
}
body.woocommerce-account .woocommerce-form input:focus {
	outline: none;
	border-color: var(--df-gold);
}

/* Bouton de connexion */
body.woocommerce-account .woocommerce-form-login__submit,
body.woocommerce-account .woocommerce-form-register__submit {
	width: 100%;
	background: var(--df-gold) !important;
	color: var(--df-dark) !important;
	border: none !important;
	border-radius: 999px !important;
	padding: 14px !important;
	font-weight: 700 !important;
	text-transform: none !important;
	box-shadow: none !important;
}
body.woocommerce-account .woocommerce-form-login__submit:hover,
body.woocommerce-account .woocommerce-form-register__submit:hover {
	background: var(--df-gold-dark) !important;
}

body.woocommerce-account .woocommerce-LostPassword {
	text-align: center;
	margin-top: 16px;
}
body.woocommerce-account .woocommerce-LostPassword a {
	color: var(--df-gold-dark);
}
