/* ==========================================================================
   VBCC – CSS personnalisé du site
   (anciennement dans Divi > Options du thème > CSS personnalisé)
   ========================================================================== */

/* --------------------------------------------------------------------------
   Formulaire Gravity Forms #10 – commande de vins
   -------------------------------------------------------------------------- */

/* Alignement horizontal des 4 vins */
#gform_fields_10 > li.gfield--type-product {
	display: inline-block;
	width: 23% !important; /* 4 vins en ligne, avec un peu d'espace */
	vertical-align: top;
	margin-right: 1%;
}

#gform_fields_10 > li.gfield--type-product:last-child {
	margin-right: 0;
}

/* Couleurs spécifiques pour chaque vin */
#gform_fields_10 > li.gfield--type-product:nth-child(3) label.gfield_label {
	color: #714b13;
}
#gform_fields_10 > li.gfield--type-product:nth-child(4) label.gfield_label {
	color: #fc6a3c;
}
#gform_fields_10 > li.gfield--type-product:nth-child(5) label.gfield_label {
	color: #512236;
}
#gform_fields_10 > li.gfield--type-product:nth-child(6) label.gfield_label {
	color: #510022;
}

/* Taille et style du captcha */
#gform_fields_10 > li.gfield--type-captcha {
	width: 30% !important;
	display: inline-block;
	vertical-align: top;
}

#gform_fields_10 > li.gfield--type-captcha .ginput_recaptcha {
	transform: scale(0.75);
	transform-origin: top left;
	margin-top: 10px;
}

/* Bouton Commander stylé */
#gform_submit_button_10 {
	background-color: #204CE5;
	color: white;
	font-weight: 700;
	font-size: 1.15rem;
	padding: 14px 40px;
	border: none;
	border-radius: 6px;
	box-shadow: 0 4px 10px rgba(32, 76, 229, 0.4);
	cursor: pointer;
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
	text-transform: uppercase;
}

#gform_submit_button_10:hover,
#gform_submit_button_10:focus {
	background-color: #001AB3;
	box-shadow: 0 6px 14px rgba(0, 26, 179, 0.6);
	outline: none;
}

/* Responsive : sur petits écrans, les champs produits et captcha deviennent full width */
@media (max-width: 767px) {
	#gform_fields_10 > li.gfield--type-product,
	#gform_fields_10 > li.gfield--type-captcha {
		width: 100% !important;
		display: block;
		margin-right: 0 !important;
		margin-bottom: 20px;
	}

	#gform_fields_10 > li.gfield--type-captcha .ginput_recaptcha {
		transform: scale(1);
		margin-top: 0;
	}

	#gform_submit_button_10 {
		width: 100%;
		padding: 16px;
	}
}

/* --------------------------------------------------------------------------
   Icône du menu (hamburger)
   --------------------------------------------------------------------------
   Les options Divi fixent la couleur des liens de menu à rgba(255,255,255,.6),
   héritage d'un en-tête sombre : l'icône était blanche sur fond blanc, donc
   invisible. Elle reprend ici la couleur du club, et la croix de fermeture
   reste blanche sur le panneau bleu du menu.
   -------------------------------------------------------------------------- */

.et_header_style_slide .mobile_menu_bar:before,
.et_header_style_slide .mobile_menu_bar:after {
	color: #182845;
}

.et_header_style_slide .mobile_menu_bar:hover:before {
	color: #004fe8;
}

.et_pb_slide_menu_active .et_toggle_slide_menu:after {
	color: #ffffff;
}

/* --------------------------------------------------------------------------
   En-tête collant sur mobile et tablette
   --------------------------------------------------------------------------
   Divi limite son option « barre de navigation fixe » aux écrans ≥ 981 px :
   en dessous, l'en-tête est en position absolue et disparaît au défilement.
   L'espace réservé en haut de page (padding de #page-container) est déjà
   calculé par Divi, il n'y a donc rien à compenser.
   -------------------------------------------------------------------------- */

@media (max-width: 980px) {
	.et_fixed_nav #main-header {
		position: fixed !important;
		top: 0;
		left: 0;
		right: 0;
		width: 100%;
	}

	.admin-bar.et_fixed_nav #main-header {
		top: 46px;
	}
}