/* ==============================================
	CSS A LA RACINE WEBSITE SELECTION COLORS
============================================== */

	::selection{color:white;background-color:#363636;}

/* ==============================================
	TEXT COLORS
============================================== */

	/* Colored #3772A6 #395359 */
	.colored,.colored-hover:hover,.colored-active.active,
	.plyr--full-ui input[type=range],
	.modern-nav.link-hover-01 .nav-container .nav-menu .nav-links li:not(.extra-links):hover>a.nav-link,
	.modern-nav.link-hover-01 .nav-container li.extra-links>a.nav-link:hover,
	.modern-nav.link-hover-01 .nav-container li.active>a.nav-link,
	.modern-nav.link-hover-01 .nav-container li>a.nav-link.active{
		color:#152861 !important;
	}
	/* Colored1 #EBB815 #56828c */
	.colored1,.colored1-hover:hover,.colored1-active.active{
		color:#56a9d7 !important;
	}
	/* Colored2 #A65221 #f4f4f4 */
	.colored2,.colored2-hover:hover,.colored2-active.active{
		color:#b7c4ec !important;
	}

	/* Colored3 Danger */
	.colored3,.colored3-hover:hover,.colored3-active.active{
		color:#E61C1C !important;
	}

/* ==============================================
	BACKGROUND COLORS
============================================== */

	/* bg-colored */
	.bg-colored,.bg-colored-hover:hover,.bg-colored-active.active,.bg-colored-hover-trigger:hover .bg-colored-hover-target,
	.modern-nav .nav-links .nav-link:before,
	.irs-from, .irs-to, .irs-single, .irs-line-left, .irs-line-mid, .irs-line-right,
	.dots-colored-active:not(.dots-circle) .slick-dots li.slick-active:before,
	.plyr__control--overlaid,
	.plyr__volume .plyr__control:hover,
	.plyr--video .plyr__control.plyr__tab-focus, .plyr--video .plyr__control:hover, .plyr--video .plyr__control[aria-expanded=true],
	.twentytwenty-handle:active,
	.underline-slide.underline-colored:before,.underline-slide.underline-colored:after{
		background-color:#152861 !important;
	}
	/* bg-colored1 */
	.bg-colored1,.bg-colored1-hover:hover,.bg-colored1-active.active,.bg-colored1-hover-trigger:hover .bg-colored1-hover-target{
		background-color:#56a9d7 !important;
	}
	/* bg-colored2 */
	.bg-colored2,.bg-colored2-hover:hover,.bg-colored2-active.active,.bg-colored1-hover-trigger:hover .bg-colored1-hover-target{
		background-color:#b7c4ec !important;
	}
    /* bg-colored3 */
	.bg-colored3,.bg-colored3-hover:hover,.bg-colored3-active.active,.bg-colored1-hover-trigger:hover .bg-colored1-hover-target{
		background-color:#E61C1C !important;
	}
	/* Soft backgrounds - colored Tones */
	.bg-soft-colored:before,.bg-soft-colored-hover:hover:before,.bg-soft-colored-active.active:before,.bg-soft-colored9:before,.bg-soft-colored9-hover:hover:before,.bg-soft-colored9-active.active:before{background-color:rgba(235,66,66,0.9);}
	.bg-soft-colored1:before,.bg-soft-colored1-hover:hover:before,.bg-soft-colored1-active.active:before{background-color:rgba(235,66,66,0.1);}
	.bg-soft-colored2:before,.bg-soft-colored2-hover:hover:before,.bg-soft-colored2-active.active:before{background-color:rgba(235,66,66,0.2);}
	.bg-soft-colored3:before,.bg-soft-colored3-hover:hover:before,.bg-soft-colored3-active.active:before{background-color:rgba(235,66,66,0.3);}
	.bg-soft-colored4:before,.bg-soft-colored4-hover:hover:before,.bg-soft-colored4-active.active:before{background-color:rgba(235,66,66,0.4);}
	.bg-soft-colored5:before,.bg-soft-colored5-hover:hover:before,.bg-soft-colored5-active.active:before{background-color:rgba(235,66,66,0.5);}
	.bg-soft-colored6:before,.bg-soft-colored6-hover:hover:before,.bg-soft-colored6-active.active:before{background-color:rgba(235,66,66,0.6);}
	.bg-soft-colored7:before,.bg-soft-colored7-hover:hover:before,.bg-soft-colored7-active.active:before{background-color:rgba(235,66,66,0.7);}
	.bg-soft-colored8:before,.bg-soft-colored8-hover:hover:before,.bg-soft-colored8-active.active:before{background-color:rgba(235,66,66,0.8);}
	.bg-soft-colored10:before,.bg-soft-colored10-hover:hover:before,.bg-soft-colored10-active.active:before{background-color:rgba(235,66,66,1);}

/* ==============================================
	BORDER COLORS
============================================== */

	/* b-colored */
	.b-colored,.b-colored-hover:hover,.b-colored-active.active,
	.strip-timeline .dates div:hover:after, .strip-timeline .dates div.active:after,
	.interactive-packages .selector{
		border-color:#152861 !important;
	}
	/* b-colored1 */
	.b-colored1,.b-colored1-hover:hover,.b-colored1-active.active{
		border-color:#56a9d7 !important;
	}
	/* b-colored2 */
	.b-colored2,.b-colored2-hover:hover,.b-colored2-active.active{
		border-color:#b7c4ec !important;
	}

/* ==============================================
	SVG COLORS
============================================== */

/* Fills */
	/* fill-colored */
	.fill-colored,.fill-colored-hover:hover,.fill-colored-active.active{
		fill:#152861 !important;
	}
	/* fill-colored1 */
	.fill-colored1,.fill-colored1-hover:hover,.fill-colored1-active.active{
		fill:#56a9d7 !important;
	}
	/* fill-colored2 */
	.fill-colored2,.fill-colored2-hover:hover,.fill-colored2-active.active{
		fill:#b7c4ec !important;
	}

/* Strokes */
	/* stroke-colored */
	.stroke-colored,.stroke-colored-hover:hover,.stroke-colored-active.active{
		stroke:#152861 !important;
	}
	/* stroke-colored1 */
	.stroke-colored1,.stroke-colored1-hover:hover,.stroke-colored1-active.active{
		stroke:#56a9d7 !important;
	}
	/* stroke-colored2 */
	.stroke-colored2,.stroke-colored2-hover:hover,.stroke-colored2-active.active{
		stroke:#b7c4ec !important;
	}

/* ==============================================
	GRADIENT BACKGROUNDS
============================================== */

	/* bg-gradient, hover, active, bg-soft-gradient */
	.bg-soft-gradient:before,.bg-gradient,.bg-gradient-hover:hover,.bg-gradient-active.active{
		background-image: #EC7876 !important; background-image: linear-gradient(-90deg, #EC7876 0%, #F4A088 100%) !important;
	}
	/* bg-gradient1, hover, active, bg-soft-gradient1 */
	.bg-soft-gradient1:before,.bg-gradient1,.bg-gradient1-hover:hover,.bg-gradient1-active.active{
		background-image: #FFC86C !important; background-image: linear-gradient(-90deg, #FFC86C 0%, #FFA726 100%) !important;
	}
	/* bg-gradient2, hover, active, bg-soft-gradient2 */
	.bg-soft-gradient2:before,.bg-gradient2,.bg-gradient2-hover:hover,.bg-gradient2-active.active{
		background-image: #6C56DA !important; background-image: linear-gradient(-90deg, #6C56DA 0%, #8C7AE6 100%) !important;
	}
	/* bg-gradient3, hover, active, bg-soft-gradient3 */
	.bg-soft-gradient3:before{ opacity: 0.92;}
	.bg-soft-gradient3:before,.bg-gradient3,.bg-gradient3-hover:hover,.bg-gradient3-active.active{
		background-image: #7CD8AC !important; background-image: linear-gradient(-90deg, #7CD8AC 0%, #57AF82 100%) !important;
	}
	/* bg-gradient4, hover, active, bg-soft-gradient4 */
	.bg-soft-gradient4:before,.bg-gradient4,.bg-gradient4-hover:hover,.bg-gradient4-active.active{
		background-image: #131313 !important; background-image: linear-gradient(45deg,  #131313 0%,#282828 100%) !important;
	}

/* ==============================================
	STYLE POUR LE BOUTON ADMIN
============================================== */
  
    /* 1. On prépare le bouton pour accueillir le texte absolu 
    .nav-button {
        position: relative;
        overflow: hidden;
        display: inline-block;
    } */

    /* 2. On masque le texte d'origine au survol
    .nav-button:hover span {
        display: none;
    } */

    /* 3. On affiche le nouveau texte au survol
    .nav-button:hover::after {
        content: attr(data-hover); 
        display: block;
        width: 100%;
        color: inherit; 
    }  */

	/* 1. On prépare le bouton */
/* 1. On prépare le bouton pour accueillir le texte absolu */
/* 1. On prépare le bouton */
/* 1. Le bouton (taille de base "Zone Admin") */
.nav-button {
    position: relative;
    overflow: hidden;
    display: inline-block;
    white-space: nowrap;
    
    /* On anime la couleur de fond en douceur */
    transition: background-color 0.4s ease; 
}

/* 2. Le texte d'origine */
.nav-button span {
    display: inline-block;
    max-width: 150px; /* Largeur max pour "Zone Admin" */
    opacity: 1;
    /* C'est ici qu'on gère la vitesse de fermeture */
    transition: max-width 0.8s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.4s ease;
}

/* Au survol, il se rétracte lentement à 0 */
.nav-button:hover span {
    max-width: 0;
    opacity: 0;
}

/* 3. Le nouveau texte (Mot de passe requis) */
.nav-button::after {
    content: attr(data-hover); 
    display: inline-block;
    color: inherit; 
    
    max-width: 0; /* Fermé par défaut */
    opacity: 0;
    /* C'est ici qu'on gère la vitesse d'ouverture (style Apple) */
    transition: max-width 1.8s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.6s ease;
}

/* Au survol, il s'ouvre lentement jusqu'à sa taille finale */
.nav-button:hover::after {
    max-width: 200px; /* Largeur max pour "Mot de passe requis" */
    opacity: 1;
}
  


/* ==============================================
	CUSTOM FONT
==============================================

    h1,h2,h3,h4,h5,h6{
      font-family:Poppins,Inter,system-ui,Arial,sans-serif;
      line-height:1.2;
      margin:0 0 .5rem;
      color:var(--brand);
    } */