/* ==========================================================================
   Etika Spirulina — Paliers du panier latéral
   Markup produit par inc/funnelkit/es-fk-paliers.php.
   --------------------------------------------------------------------------
   Ce bloc nous appartient, personne ne cherche à le surcharger : le préfixe
   court `#fkcart-modal` suffit, contrairement au reste du panneau où il faut
   passer devant le CSS du plugin.
   ========================================================================== */

:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers{
	flex: none;
	padding: 16px var(--es-fk-gouttiere) 6px;
	background: var(--es-fk-blanc);
	font-family: var(--es-fk-font);
}

:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers__etat{
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 0;
	color: var(--es-fk-foret);
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.45;
}

:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers__ic{
	width: 16px;
	height: 16px;
	flex: none;
	margin-top: 2px;
	color: var(--es-fk-vif-700);
}

:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers__barre{
	height: 7px;
	margin-top: 10px;
	border-radius: 99px;
	background: var(--es-fk-filet);
	overflow: hidden;
}

:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers__barre i{
	display: block;
	height: 100%;
	border-radius: 99px;
	background: var(--es-fk-vif);
	transition: width .45s var(--es-fk-ease);
}

/* Le montant manquant sort de wc_price(), donc emballé dans .amount et <bdi>.
   Il hérite de la ligne au lieu de reprendre la mise en forme des prix du
   thème, qui le mettrait en gras au milieu d'une phrase. */
:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers__suite{
	margin: 8px 0 0;
	color: var(--es-fk-foret-500);
	font-size: 12.5px;
	font-weight: 400;
	line-height: 1.45;
}

:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers__suite .amount,
:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers__suite bdi,
:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers__etat .amount,
:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers__etat bdi{
	font: inherit;
	color: inherit;
}

/* Ligne « Livraison » du récapitulatif. Le vert ne s'allume qu'une fois le
   seuil franchi : c'est le seul signal de gain de la colonne de montants. */
body #fkcart-modal .fkcart-preview-ui .es-fk-livraison--offerte .fkcart-summary-amount{
	color: var(--es-fk-lien);
	font-weight: 600;
}

body #fkcart-modal .fkcart-preview-ui .es-fk-livraison:not(.es-fk-livraison--offerte) .fkcart-summary-amount{
	color: var(--es-fk-foret-500);
	font-size: 13.5px;
	font-weight: 400;
}

/* Pas de règle mobile ici : le bloc est un descendant de .fkcart-preview-ui,
   il hérite du resserrement de --es-fk-gouttiere posé par es-fk-mini-panier.css
   sous 480 px. Une seconde déclaration finirait par diverger. */

@media (prefers-reduced-motion: reduce){

	:is(#fkcart-modal, .elementor-shortcode) .es-fk-paliers__barre i{
		transition: none;
	}
}