/*
Theme Name: Theme Apore 2025 LB
*/

:root {
	--chili-red: #E7301F;
	--red-alert: #EB2C2C;
	--golden-gate-bridge: #ED4D0E;
	--persimmon: #EB6218;
	--sunset: #F1E0C5;
	--baby-powder: #FBFBF5;
	--platinum: #F6F6EA;
	--columbian-blue: #CEE3F4;
	--bleu-de-france: #0083EC;
    --written-yale-blue:#082D62;
	--yale-blue: #083862; 
	--dark-slate-blue: #242E42;
	--bg-color: #F8F9FA;
	--slate-blue:#617092;
    --grise: #e6e9e9;
	

	--profiles: #CEE3F4;
	--tubes: #3185E3;
	--elevateurs: #064994;
	--convoyeurs: #083862;
	--partenaires: #0D0F3D;
}

body{
	font-family: 'Poppins', Arial, sans-serif;
	background-color: #F8F9FA;
}

/* ------------------------ Header ------------------------*/


.glass-effect {
    position: sticky; top: 0; background: rgba(255, 255, 255, 0.2); backdrop-filter: blur(10px);  border-radius: 10px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

header li{
	margin-right: 15px;
	padding: 0px 15px 0px 15px;
}
.nav-link{
	text-decoration: none; color: var(--dark-slate-blue);
}
        
header li:hover, 
header li:focus, 
header li:active {
	margin-right: 15px;
	padding: 0px 15px 0px 15px;
	border-radius: 20px;
	background-color: var(--dark-slate-blue);
}

header li:active{
    border: 20px;
    background-color: var(--dark-slate-blue);
}

header li:active .nav-link{
    color: var(--baby-powder);
}

header li:hover .nav-link {
	text-decoration: none;
	color: var(--baby-powder);
}


.rectaangle {
    clip-path: polygon(5% -40%, 95% -40%, 101% 110%, -1% 104%);    
}



/* ------------------------ Barre de nav ------------------------*/


li {
	margin-right: 15px;
	padding: 0px 15px 0px 15px;
}

.navbar-brand img {
    border: none;
    box-shadow: none;
    outline: none;
}

.nav-item:hover, 
.nav-item:focus, 
.nav-item:active {
    margin-right: 15px;
    padding: 0px 15px 0px 15px;
    border-radius: 20px;
    background-color: var(--dark-slate-blue);
}
.nav-item:hover .nav-link {
	text-decoration: none;
	color: var(--baby-powder);
}


.nav-itemCrea:hover, 
.nav-itemCrea:focus, 
.nav-itemCrea:active {
	margin-right: 15px;
	padding: 0px 15px 0px 15px;
	border-radius: 20px;
	background-color: var(--columbian-blue);
}
.nav-itemCrea .nav-link,
.nav-itemCrea:focus .nav-link {
    text-decoration: none;
    color: var(--baby-powder);
}
.nav-itemCrea:hover .nav-link {
    text-decoration: none;
    color: var(--dark-slate-blue);
}

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


#btn-back-to-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  display: none;
}

.btnToutVoir{
	color: var(--slate-blue);
}
.btnToutVoir:hover,
.btnToutVoir:focus,
.btnToutVoir:active {
	color: var(--drak-slate-blue);
}

.btn-bleu {
	text-decoration: none;
    border: 2px solid transparent;
    background-color: transparent;
    border-radius: 10px;
    padding: 10px;
    background-color: var(--bleu-de-france);
    color: var(--baby-powder);
}

.btn-bleu:hover, 
.btn-bleu:active,
.btn-bleu:focus {
    border: 2px solid var(--bleu-de-france);
    background-color: transparent;
    color: var(--bleu-de-france);
    text-decoration: none;
}

.btn-bleu {
    border-radius: 10px;
    padding: 10px;
    color: var(--baby-powder);
    text-decoration: none;
    border: 2px solid var(--bleu-de-france);
    background-color: transparent;
    transition: background-color 0.3s ease, transform 0.3s ease;
}
.btn-bleu:hover {
    text-decoration: none;
    color: var(--bleu-de-france);
    background-color:rgba(11, 23, 93, 0.42);
    border: 2px solid var(--bleu-de-france);
    transform: scale(0.95);
}

.btn-outline-bleu-de-france {
        padding: 10px;
        border-radius: 10px;
        text-decoration: none;
        color: var(--bleu-de-france);
        background-color: transparent;
        border: 2px solid var(--bleu-de-france);
        transition: background-color 0.3s ease, transform 0.3s ease;
}

.btn-outline-bleu-de-france:hover
.btn-outline-bleu-de-france:active
.btn-outline-bleu-de-france:focus {
    color: var(--baby-powder);
    background-color: var(--bleu-de-france);
    transform: scale(0.95);
}



/* ------------------------ Footer ------------------------*/


.footer-links li {
     margin-bottom: 0.5rem;
}

.footer-links li a {
    color: #0a3b55;
    text-decoration: none;
}

.footer-links li a:hover {
    text-decoration: underline;
}

/* .footer-title {
    font-weight: 600; margin-bottom: 1rem;
} */

.footer-bottom .container a {
    color: #0a3b55;
    text-decoration: none;
    margin-right: 1.5rem;
}

.footer-bottom .container a:hover {
    text-decoration: underline;
}