/**
 * PNC France — Espace adhérent et compléments Divi
 *
 * Reprise du « CSS additionnel » du personnalisateur, intégré au thème pour
 * être versionné et relu. Trois choses ont été faites au passage :
 *
 * 1. Déduplication. Le CSS additionnel contenait deux fois la totalité de son
 *    contenu, et répétait à l'identique le style de quatre tableaux et de cinq
 *    groupes de champs.
 * 2. Retrait de ce qui ne sert plus : le décalage de 150 px sous l'en-tête
 *    (l'ancien en-tête Divi était en position absolue, le nôtre est dans le
 *    flux), l'icône de recherche « bb-search-icon » et la bascule du menu
 *    mobile Divi, tous trois remplacés par le nouvel en-tête.
 * 3. Suppression d'une soixantaine de sélecteurs à corps vide.
 *
 * Les couleurs littérales sont conservées telles quelles là où elles ne
 * correspondent à aucun jeton du thème (rouges d'annulation, notamment).
 *
 * @package PNC_France
 */

/* -------------------------------------------------------------------------
 * Compléments Divi encore utilisés
 * ---------------------------------------------------------------------- */

/* Bouton « retour en haut » de Divi */
.et_pb_scroll_top {
	background-color: var(--pnc-color-brand-blue) !important;
}

/* Bouton d'article, posé à la main dans le contenu */
.pnc_article_btn {
	display: inline-block;
	padding: 10px 20px;
	font-size: 14px;
	font-weight: 700 !important;
	letter-spacing: 2px;
	text-transform: uppercase !important;
	color: #ffffff !important;
	background-color: #8bb945;
	border-color: transparent;
	border-radius: 7px;
}

.pnc_article_btn:hover {
	background-color: #2e6d02 !important;
}

/* Grille d'articles du module Divi Supreme, sur la page d'accueil */
.pa-blog-equal-height .pa-auto-height {
	height: auto !important;
}

.pa-blog-equal-height .pa-auto-margin {
	margin-top: 20px !important;
}

.pa-blog-equal-height .post-content {
	margin-bottom: 0 !important;
}

.pa-blog-equal-height .more-link {
	padding: 10px 25px;
}

.more-link:hover {
	background-color: #023177 !important;
}

/* Pagination du module blog Divi, en français */
.et_pb_blog_grid .pagination > .alignleft a,
.et_pb_blog_grid .pagination > .alignright a {
	visibility: collapse;
}

.et_pb_blog_grid .pagination > .alignleft a::before {
	content: "Précédents";
	visibility: visible;
}

.et_pb_blog_grid .pagination > .alignright a::before {
	content: "Suivants";
	visibility: visible;
}

/* -------------------------------------------------------------------------
 * Paid Memberships Pro — éléments communs
 * ---------------------------------------------------------------------- */

/*
 * Champs de saisie : la même déclaration était répétée cinq fois
 * (connexion, mot de passe oublié, profil, don, tunnel d'adhésion).
 */
#loginform input[type="text"],
#loginform input[type="password"],
input#user_login,
#donation,
div.pmpro_member_profile_edit-field > input,
div.pmpro_checkout-field > input[type="text"],
div.pmpro_checkout-field > input[type="number"],
div.pmpro_checkout-field > input[type="password"],
div.pmpro_checkout-field > input[type="email"],
div.pmpro_checkout-field > select {
	box-sizing: border-box;
	width: 100%;
	margin: 8px 0;
	padding: 12px 20px;
	border: 1px solid #bbb;
	border-radius: 5px;
}

div.pmpro_checkout-field > input:focus,
div.pmpro_checkout-field > select:focus {
	border-color: #2d3940;
}

/* Cases à cocher et boutons radio des formulaires d'adhésion */
.pmpro_form input[type="checkbox"],
.pmpro_form input[type="radio"],
.pmpro_checkout-field input[type="checkbox"],
.pmpro_checkout-field input[type="radio"] {
	width: 15px;
	height: 15px;
}

/* Libellés */
#loginform label,
#lostpasswordform label,
div.pmpro_member_profile_edit-field > label,
.pmpro_lost_password-instructions {
	color: var(--pnc-color-brand-blue);
}

.pmpro_lost_password-instructions {
	font-size: 14px;
}

/* -------------------------------------------------------------------------
 * Boutons
 * ---------------------------------------------------------------------- */

.pmpro_btn,
.pmpro_btn-select {
	color: #ffffff !important;
	background-color: var(--pnc-color-brand-blue) !important;
	font-family: sans-serif;
	font-size: 14px;
	transition: background-color 300ms;
}

.pmpro_btn-select:hover {
	background-color: #001c5e !important;
}

.pmpro_btn.disabled,
.pmpro_btn[disabled],
fieldset[disabled] .pmpro_btn {
	color: var(--pnc-color-brand-blue) !important;
	background-color: #dedcdc !important;
	opacity: 1;
}

/* Boutons de soumission : connexion, mot de passe oublié, tunnel */
#wp-submit,
.pmpro_submit input,
#pmpro_btn-submit {
	padding: 12px 30px;
	font-family: "Open Sans", sans-serif;
	font-size: 14px;
	font-weight: 400;
	text-transform: uppercase;
	color: #ffffff;
	background-color: var(--pnc-color-brand-blue);
	border: none;
	border-radius: 5px;
	transition: background-color 300ms;
}

#wp-submit:hover,
.pmpro_submit input:hover,
#pmpro_btn-submit:hover {
	background-color: #001c5e !important;
}

.pmpro_submit {
	text-align: center;
}

/* Bouton d'affichage du mot de passe */
button.pmpro_btn-password-toggle {
	padding: 3px 5px !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	color: #ffffff !important;
}

button.pmpro_btn-password-toggle svg {
	stroke: #ffffff !important;
}

#pmpro_btn-password-toggle-1 {
	background-color: #ffffff !important;
}

/* Annulation : rouge, pour distinguer l'action destructrice */
input.pmpro_btn-cancel {
	color: #ffffff !important;
	text-decoration: none !important;
	background-color: #c60000 !important;
	transition: background-color 300ms;
}

input.pmpro_btn-cancel:hover {
	background-color: #9e0000 !important;
}

#pmpro_actionlink-cancel,
#pmpro_actionlink-logout,
.pmpro_cancel-membership-cancel a,
#pmpro_cancel .pmpro_actions_nav a,
.pmpro_member_log_out a,
.pmpro_billing_wrap a:first-child {
	color: #c60000;
}

#pmpro_actionlink-cancel:hover,
#pmpro_actionlink-logout:hover,
.pmpro_cancel-membership-cancel a:hover,
#pmpro_cancel .pmpro_actions_nav a:hover,
.pmpro_member_log_out a:hover,
.pmpro_billing_wrap a:first-child:hover {
	color: #9e0000;
}

/* -------------------------------------------------------------------------
 * Liens
 * ---------------------------------------------------------------------- */

.pmpro_actionlinks a,
.pmpro_actions_nav > a,
.pmpro_login_wrap p.pmpro_actions_nav a,
#pmpro_account-profile ul li a,
.pmpro_billing_wrap a,
.pmpro_confirmation_wrap a,
.pmpro_message a,
.pmpro_check_instructions a,
#pmpro_levels-return-home {
	font-family: sans-serif;
	font-size: 14px;
	color: var(--pnc-color-brand-blue);
}

.pmpro_actionlinks a:hover,
.pmpro_actions_nav > a:hover,
.pmpro_login_wrap p.pmpro_actions_nav a:hover,
.pmpro_billing_wrap a:hover,
#pmpro_levels-return-home:hover {
	color: #001c5e;
}

/* -------------------------------------------------------------------------
 * Tableaux — le même style était répété pour quatre tableaux différents
 * ---------------------------------------------------------------------- */

#pmpro_account #pmpro_account-membership .pmpro_table,
#pmpro_account-invoices .pmpro_table,
#pmpro_cancel .pmpro_table,
#pmpro_invoices_table,
#pmpro_levels_table {
	width: 100%;
	min-width: 400px;
	margin: 25px 0;
	font-family: sans-serif;
	font-size: 14px;
	border: 0;
	border-collapse: collapse;
	border-radius: 10px;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
}

#pmpro_levels_table {
	min-width: 0;
	table-layout: fixed;
}

#pmpro_account #pmpro_account-membership .pmpro_table thead tr,
#pmpro_account-invoices .pmpro_table thead tr,
#pmpro_cancel .pmpro_table thead tr,
#pmpro_invoices_table thead tr,
#pmpro_levels_table thead tr {
	text-align: left;
	color: #ffffff;
	background-color: var(--pnc-color-brand-blue);
}

#pmpro_account #pmpro_account-membership .pmpro_table thead th,
#pmpro_account-invoices .pmpro_table thead th,
#pmpro_cancel .pmpro_table thead th,
#pmpro_invoices_table thead th,
#pmpro_levels_table thead th {
	color: #ffffff;
}

#pmpro_account #pmpro_account-membership .pmpro_table tbody td,
#pmpro_account-invoices .pmpro_table tbody td,
#pmpro_cancel .pmpro_table tbody td,
#pmpro_invoices_table tbody td,
#pmpro_levels_table tbody td {
	color: #000000;
}

#pmpro_account #pmpro_account-membership .pmpro_table tbody td a,
#pmpro_account-invoices .pmpro_table tbody td a,
#pmpro_invoices_table tbody td a,
#pmpro_levels_table tbody td a {
	font-family: sans-serif;
	font-size: 14px;
	color: var(--pnc-color-brand-blue);
}

#pmpro_account #pmpro_account-membership .pmpro_table tbody td a:hover,
#pmpro_account-invoices .pmpro_table tbody td a:hover,
#pmpro_invoices_table tbody td a:hover,
#pmpro_levels_table tbody td a:hover {
	color: #001c5e;
}

/* Tableau des niveaux : passage en cartes sur petit écran */
@media screen and (max-width: 500px) {
	#pmpro_levels_table {
		border: 0;
		box-shadow: none;
	}

	#pmpro_levels_table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		border: none;
		clip: rect(0 0 0 0);
	}

	#pmpro_levels_table tbody {
		background-color: transparent;
	}

	#pmpro_levels_table tr {
		display: block;
		margin-bottom: 3em;
		background-color: transparent;
		border-radius: 10px;
		box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
	}

	#pmpro_levels_table td {
		display: block;
		font-size: 0.8em;
		text-align: center;
		background-color: transparent;
		border-bottom: 1px solid #ddd;
	}

	#pmpro_levels_table tbody > tr td:nth-child(1) {
		font-weight: bold;
		color: #ffffff;
		background-color: var(--pnc-color-brand-blue);
	}

	#pmpro_levels_table td:nth-child(1)::before,
	#pmpro_levels_table td:nth-child(2)::before {
		float: left;
		font-weight: bold;
		text-transform: uppercase;
		color: #ffffff;
	}

	#pmpro_levels_table td:nth-child(1)::before {
		content: "Niveau :";
	}

	#pmpro_levels_table td:nth-child(2)::before {
		content: "Montant :";
	}
}

/* -------------------------------------------------------------------------
 * Titres et messages
 * ---------------------------------------------------------------------- */

#pmpro_account .pmpro_box h3,
#pmpro_cancel h2,
.pmpro_checkout h3 span.pmpro_checkout-h3-name {
	margin-bottom: 25px;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.3em;
	text-align: center;
	text-transform: uppercase;
	color: #023177;
}

.pmpro_checkout h3 span.pmpro_checkout-h3-name {
	font-size: 20px;
}

.pmpro_checkout h3 span.pmpro_checkout-h3-msg {
	font-size: 18px;
	font-weight: 800;
	text-decoration: underline;
	text-transform: uppercase;
	color: #2e6d02;
}

h3.pmpro_member_display_name {
	margin-bottom: 25px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.3em;
	text-transform: uppercase;
	color: #8bb945;
}

h3.pmpro_member_display_name a {
	color: #023177;
}

h3.pmpro_member_display_name a:hover {
	color: #001c5e;
}

.pmpro_message,
.pmpro_check_instructions {
	color: var(--pnc-color-brand-blue);
	background-color: #efefef;
	border: 1px solid #2e6d02;
}

.pmpro_check_instructions {
	margin: 0.5em 0;
	padding: 10px 15px;
	border-radius: 4px;
}

/* -------------------------------------------------------------------------
 * Mises en page ponctuelles
 * ---------------------------------------------------------------------- */

.pmpro_login_wrap {
	text-align: center !important;
}

.pmpro_login_wrap > hr,
div.pmpro_lost_password_wrap hr,
.pmpro_checkout-fields hr,
#pmpro_user_fields hr,
#pmpro_checkout_box-profession hr,
#pmpro_autorenewal_checkbox hr,
#pmpro_payment_method hr,
#pmpro_billing_address_fields hr,
div.pmpro_submit hr {
	margin: 25px 0;
	border-top: 1px solid #8bb945;
}

.pmpro_cancel_wrap {
	min-height: 50vh;
}

#pmpro_account .pmpro_box {
	border-top: 0;
}

#pmpro_account .pmpro_box p,
#pmpro_account .pmpro_box ul,
#pmpro_cancel p,
.pmpro_checkout-fields *,
.pmpro_check_instructions p,
.pmpro_confirmation_wrap p,
.pmpro_confirmation_wrap ul,
.pmpro_confirmation_wrap span,
.pmpro_confirmation_wrap strong {
	color: #000000;
}

.pmpro_billing_wrap p,
.pmpro_billing_wrap li,
.pmpro_invoice_wrap > p {
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 14px;
	color: #000000;
}

#pmpro_account-links {
	display: none;
}

.pmpro_actions_nav {
	margin-bottom: 200px;
}

#pmpro_level_cost {
	margin: 25px 0;
}

#pmpro_donations {
	display: inline-block;
}

#pmpro_donations > div.pmpro_small > p {
	font-size: 14px;
}

.pmpro_payment_instructions {
	margin-bottom: 25px;
}

#pmpro_autorenewal_checkbox h3 span {
	text-align: left;
}

/* Conditions générales : zone défilante */
#pmpro_license {
	margin-bottom: 30px;
	padding: 20px 10px;
	border-radius: 10px;
}

#pmpro_license::-webkit-scrollbar {
	width: 1em;
}

#pmpro_license::-webkit-scrollbar-track {
	border-radius: 0 10px 10px 0;
	-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

#pmpro_license::-webkit-scrollbar-thumb {
	height: 20%;
	background-color: var(--pnc-color-brand-blue);
	border-radius: 10px;
}

/* Passerelle Stripe : le bloc de paiement passe en bleu de marque */
.pmpro_checkout_gateway-stripe form.pmpro_form #pmpro_payment_information_fields .pmpro_checkout-fields,
.pmpro_billing_gateway-stripe form.pmpro_form #pmpro_payment_information_fields .pmpro_checkout-fields {
	padding: 2%;
	background-color: var(--pnc-color-brand-blue);
	border-radius: 10px;
}

.pmpro_checkout_gateway-stripe form.pmpro_form #pmpro_payment_information_fields .pmpro_checkout-fields label,
.pmpro_billing_gateway-stripe form.pmpro_form #pmpro_payment_information_fields .pmpro_checkout-fields label {
	color: #ffffff;
}
