/*
 Theme Name: 	Galactic Chloé Custom Theme
 Description: 	Theme enfant pour le site galactic-chloe.com
 Author: 		Lucas Délèze
 Author URI: 	numeriques.ch
 Template: 		hello-elementor
 Version: 		1.0.0
 License:      	GNU General Public License v2 or later
 License URI:  	http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         	dark, full-content-editing, responsive-layout, accessibility-ready
 Text Domain:  	hello-elementor-child
*/

/* CSS GENERAL link */
#link {
    width: fit-content;
    margin: auto;
	z-index: 2;
}

/* CSS PRIMARY BUTTON ON HOMEPAGE */
.prim_home_button {
	color: #001832 !important;
	background-color: #F6F6F6; /* Couleur de fond blanc */
	display: flex;
	justify-content: center; /* Centre horizontalement */
	align-items: center; /* Centre verticalement */
	width: fit-content;
}

.prim_home_button:hover {
    background-color: #F0676E;
}

/* smartphone */
@media (min-width: 300px) {
	.prim_home_button {
		font-weight: 500 !important;
		font-size: 0.9rem !important;
		border: 1.5px solid #001832; /* Bordure bleu nuit */
		border-radius: 24px;
		padding: 8px 24px 8px 24px;
	}
}

/* tablette portrait */
@media (min-width: 850px) {
	.prim_home_button {
		font-weight: 500 !important;
		font-size: 1rem !important;
		border: 2px solid #001832; /* Bordure bleu nuit */
		border-radius: 24px;
		padding: 8px 24px 8px 24px;
	}
}

/* desktop and larger */
@media (min-width: 1100px) {
	.prim_home_button {
		font-weight: 600 !important;
		font-size: 1.1rem !important;
		border: 2px solid #001832; /* Bordure bleu nuit */
		border-radius: 32px;
		padding: 8px 32px 8px 32px;
	}
}

/* CSS SECONDARY BUTTON ON HOMEPAGE */
.sec_home_button {
    color: #F6F6F6;
    font-weight: 600 !important;
	font-size: 1.1rem !important;
	border-radius: 32px;
    padding: 8px 32px 8px 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
}

.sec_home_button:hover {
    color: #F0676E;
	text-shadow: 0 0 3px #001832;
}

/* CSS for buttons on mobile devices */
#mobile_button {
    font-size: 0.9rem !important;
    border-radius: 24px;
    border-width: 1.5px;
    padding: 8px 24px 8px 24px;
}

/* CSS SCROLL BUTTON */
#scroll {
    width: 45px;
}

.scroll_button {
	justify-content: center;
    align-items: center;
}

.scroll_button svg {
    fill: #F0676E; /* Assurez-vous que le SVG a la propriété 'fill' pour la couleur, si c'est une bordure alors 'stroke' */
}

.scroll_button:after {
    content: url('data:image/svg+xml;utf8,%0A%3Csvg%20width%3D%2214%22%20height%3D%2218%22%20viewBox%3D%220%200%2014%2018%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M6.54543%2016.3636C6.08725%2016.3636%205.72725%2016.0036%205.72725%2015.5454V0.818179C5.72725%200.359999%206.08725%200%206.54543%200C7.00361%200%207.36361%200.359999%207.36361%200.818179V15.5454C7.36361%2016.0036%207.00361%2016.3636%206.54543%2016.3636Z%22%20fill%3D%22%23F6F6F6%22%2F%3E%0A%3Cpath%20d%3D%22M6.54543%2017.9999C6.43813%2018.0012%206.33174%2017.9801%206.2331%2017.9378C6.13446%2017.8955%206.04576%2017.8331%205.97271%2017.7545L0.245454%2012.0272C-0.0818179%2011.7%20-0.0818179%2011.1927%200.245454%2010.8654C0.572725%2010.5381%201.08%2010.5381%201.40727%2010.8654L6.5618%2016.0199L11.7163%2010.8654C12.0436%2010.5381%2012.5509%2010.5381%2012.8781%2010.8654C13.2054%2011.1927%2013.2054%2011.7%2012.8781%2012.0272L7.15089%2017.7545C6.98725%2017.9181%206.77452%2017.9999%206.57816%2017.9999H6.54543Z%22%20fill%3D%22%23F6F6F6%22%2F%3E%0A%3C%2Fsvg%3E%0A'); /* Icône blanche par défaut */
}

/* CSS for paragraphe in footer */
.footer_para {
    padding: 8px;
    display: flex;
    justify-content: center; /* Centre horizontalement */
    align-items: center; /* Centre verticalement */
    width: fit-content;
}

/* CSS for footer links */
.footer_link {
    padding: 8px;
    display: flex;
    justify-content: center; /* Centre horizontalement */
    align-items: center; /* Centre verticalement */
    width: fit-content;
}

/* CSS EXTERNAL LINK */
/* Ajout d'un effet de slider orange sous le texte */
.slider {
    position: absolute;
    display:block;
    left: -12px;
    top:90%;
    height: 2px;
    background-color: #F6F6F6;
    width: 50%;
    transition: width 500ms;
}

#link:hover > .slider {
	background-color: #F0676E;
	/*height: 16px;*/
    width: 93%;
}

/* CSS IMPORTANT EXTERNAL LINKS */
.external_link {
    padding: 8px;
    display: flex;
    justify-content: center; /* Centre horizontalement */
    align-items: center; /* Centre verticalement */
    width: fit-content;
}

/* ajout de l'icône après le texte du link */
.external_link:after {
  	content: url('data:image/svg+xml;utf8,%0A%3Csvg%20width%3D%2214%22%20height%3D%2213%22%20viewBox%3D%220%200%2014%2013%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%0A%3Cpath%20d%3D%22M12.4%201.48595L2%2011.8859M5.3705%201.11401L12.7719%201.11402L12.7719%208.51538%22%20stroke%3D%22%23F7F7F7%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22round%22/%3E%0A%3C/svg%3E%0A'); /* Icône blanche par défaut */
  	margin-left: 8px;
  	width: 20px;
  	height: 20px;
}

/* Ajout d'un hover sur l'icône */
.external_link:hover:after {
  	content: url('data:image/svg+xml;utf8,%0A%3Csvg%20width%3D%2214%22%20height%3D%2213%22%20viewBox%3D%220%200%2014%2013%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%0A%3Cpath%20d%3D%22M12.3403%201.3698L2%2011.7101M5.35114%201L12.71%201.00001L12.71%208.35886%22%20stroke%3D%22%23F0676E%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22round%22/%3E%0A%3C/svg%3E%0A'); /* Icône pink au survol */
}

/* CSS IMPORTANT EXTERNAL LINKS */
.vip_external_link {
    background-color: #F0676E; /* Couleur de fond pink orange */
    border: 2px solid #001832; /* Bordure bleu nuit */
    border-radius: 32px;
    padding: 8px 32px 8px 32px;
    display: flex;
    justify-content: center; /* Centre horizontalement */
    align-items: center; /* Centre verticalement */
    width: fit-content;
}

.vip_external_link svg {
    stroke: #F0676E; /* Assurez-vous que le SVG a la propriété 'fill' pour la couleur, si c'est une bordure alors 'stroke' */
}

/* Styles pour le survol du bouton, si nécessaire */
.vip_external_link:hover {
    background-color: #001832; 
    color: #F0676E;
    border: 2px solid #F0676E; /* Bordure orange */
    border-radius: 32px;
}

.vip_external_link:after {
  	content: url('data:image/svg+xml;utf8,%0A%3Csvg%20width%3D%2214%22%20height%3D%2213%22%20viewBox%3D%220%200%2014%2013%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M12.4%201.48595L2%2011.8859M5.3705%201.11401L12.7719%201.11402L12.7719%208.51538%22%20stroke%3D%22%23F7F7F7%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A'); /* Icône blanche par défaut */
  	margin-left: 8px;
  	width: 20px; /* Ajustez si nécessaire */
  	height: 20px; /* Ajustez si nécessaire */
}

.vip_external_link:hover:after {
  	content: url('data:image/svg+xml;utf8,%0A%3Csvg%20width%3D%2214%22%20height%3D%2213%22%20viewBox%3D%220%200%2014%2013%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M12.4%201.48595L2%2011.8859M5.3705%201.11401L12.7719%201.11402L12.7719%208.51538%22%20stroke%3D%22%23F0676E%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3C%2Fsvg%3E%0A'); /* Icône orange au survol */
}

/* CSS DOWNLOAD BUTTON ON THE PAGE "My Story" */
.chloe_portraits svg {
    stroke: #F0676E; /* Assurez-vous que le SVG a la propriété 'fill' pour la couleur, si c'est une bordure alors 'stroke' */
}

/* Ajout du hover du texte */
.chloe_portraits:hover {
    color: #F0676E;
}

/* Ajout de l'icône après le texte */
.chloe_portraits:after {
	content: url('data:image/svg+xml;utf8,%0A%3Csvg%20width%3D%2218%22%20height%3D%2218%22%20viewBox%3D%220%200%2018%2018%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M8.99985%2012.375C8.66389%2012.375%208.39991%2012.1275%208.39991%2011.8125V1.6875C8.39991%201.3725%208.66389%201.125%208.99985%201.125C9.33582%201.125%209.59979%201.3725%209.59979%201.6875V11.8125C9.59979%2012.1275%209.33582%2012.375%208.99985%2012.375ZM16.1991%2016.875H1.80062C1.46466%2016.875%201.20068%2016.6275%201.20068%2016.3125V14.0625C1.20068%2013.7475%201.46466%2013.5%201.80062%2013.5C2.13658%2013.5%202.40056%2013.7475%202.40056%2014.0625V15.75H15.5991V14.0625C15.5991%2013.7475%2015.8631%2013.5%2016.1991%2013.5C16.535%2013.5%2016.799%2013.7475%2016.799%2014.0625V16.3125C16.799%2016.6275%2016.535%2016.875%2016.1991%2016.875Z%22%20fill%3D%22%23F7F7F7%22%2F%3E%0A%3Cpath%20d%3D%22M9.00017%2013.5C8.92149%2013.5009%208.84348%2013.4864%208.77115%2013.4573C8.69882%2013.4282%208.63379%2013.3853%208.58022%2013.3313L4.38066%209.39377C4.14069%209.16877%204.14069%208.82002%204.38066%208.59502C4.62064%208.37002%204.9926%208.37002%205.23257%208.59502L9.01217%2012.1388L12.7918%208.59502C13.0317%208.37002%2013.4037%208.37002%2013.6437%208.59502C13.8836%208.82002%2013.8836%209.16877%2013.6437%209.39377L9.44412%2013.3313C9.32414%2013.4438%209.16815%2013.5%209.02417%2013.5H9.00017Z%22%20fill%3D%22%23F7F7F7%22%2F%3E%0A%3C%2Fsvg%3E%0A'); /* Icône blanche par défaut */
	margin-left: 8px;
  	width: 24px; /* Ajustez si nécessaire */
  	height: 24px; /* Ajustez si nécessaire */
}

/* Ajout du hover pour l'icône après le texte */
.chloe_portraits:hover:after {
	content:	url('data:image/svg+xml;utf8,%0A%3Csvg%20width%3D%2218%22%20height%3D%2218%22%20viewBox%3D%220%200%2018%2018%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M8.99985%2012.375C8.66389%2012.375%208.39991%2012.1275%208.39991%2011.8125V1.6875C8.39991%201.3725%208.66389%201.125%208.99985%201.125C9.33582%201.125%209.59979%201.3725%209.59979%201.6875V11.8125C9.59979%2012.1275%209.33582%2012.375%208.99985%2012.375ZM16.1991%2016.875H1.80062C1.46466%2016.875%201.20068%2016.6275%201.20068%2016.3125V14.0625C1.20068%2013.7475%201.46466%2013.5%201.80062%2013.5C2.13658%2013.5%202.40056%2013.7475%202.40056%2014.0625V15.75H15.5991V14.0625C15.5991%2013.7475%2015.8631%2013.5%2016.1991%2013.5C16.535%2013.5%2016.799%2013.7475%2016.799%2014.0625V16.3125C16.799%2016.6275%2016.535%2016.875%2016.1991%2016.875Z%22%20fill%3D%22%23F0676E%22%2F%3E%0A%3Cpath%20d%3D%22M9.00017%2013.5C8.92149%2013.5009%208.84348%2013.4864%208.77115%2013.4573C8.69882%2013.4282%208.63379%2013.3853%208.58022%2013.3313L4.38066%209.39377C4.14069%209.16877%204.14069%208.82002%204.38066%208.59502C4.62064%208.37002%204.9926%208.37002%205.23257%208.59502L9.01217%2012.1388L12.7918%208.59502C13.0317%208.37002%2013.4037%208.37002%2013.6437%208.59502C13.8836%208.82002%2013.8836%209.16877%2013.6437%209.39377L9.44412%2013.3313C9.32414%2013.4438%209.16815%2013.5%209.02417%2013.5H9.00017Z%22%20fill%3D%22%23F0676E%22%2F%3E%0A%3C%2Fsvg%3E%0A'); /* Icône orange au survol */
}

/*-------------------------------------------------------------------*/
/* CSS NEWS HOMEPAGE */
.news-gallery {
    display: flex;
    flex-wrap: wrap;
	justify-content: space-between;
}

.news-card {
    background: #001832CC;
    border-radius: 16px;
    box-shadow: 0 8px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transition: transform 0.1s;
    cursor: pointer;
	display: flex;
    flex-direction: column; /* Utilisation de flex pour aligner les éléments */
	margin-bottom: 16px;
}

.news-card:hover {
    transform: scale(1.02);
}

.news-card img {
    width: 100%;
    height: auto;
    border-radius: 16px !important;
    padding: 4px 4px 0px 4px !important;
}

.card-content {
	padding: 16px 20px 20px 20px;
	flex-grow: 1; /* Prendre tout l'espace disponible */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Espace entre le contenu et le bouton */
}

.news-content h3 {
    line-height: 2rem !important;
    margin: 0px 0px 8px 0px;
}

.meta-container {
	display: flex;
    gap: 24px;
    margin: 0px 0px 18px 0px;
}

.news-content .meta-info {
    font-size: 12px;
    color: #888; /* Gris clair-foncé */
    margin: 0;
}
.news-content .meta-info i {
    margin-right: 8px;
}

.news-content p {
    font-size: 14px;
    margin: 0px 0px 16px 0px;
}

.news-link {
    display: inline-block;
    align-self: flex-end; /* Aligner à droite */
    width: fit-content;
	color: #F6F6F6 !important;
	margin: 0px 0px 0px 0px !important;
}

.news-card:hover .news-link {
	color: #F0676E !important;
}

/* ajout de l'icône après le texte du link */
.news-link:after {
  	content: url('data:image/svg+xml;utf8,%0A%3Csvg%20width%3D%2214%22%20height%3D%2213%22%20viewBox%3D%220%200%2014%2013%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%0A%3Cpath%20d%3D%22M12.4%201.48595L2%2011.8859M5.3705%201.11401L12.7719%201.11402L12.7719%208.51538%22%20stroke%3D%22%23F7F7F7%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22round%22/%3E%0A%3C/svg%3E%0A'); /* Icône blanche par défaut */
  	margin-left: 8px;
  	width: 20px;
  	height: 20px;
}

/* Ajout d'un hover sur l'icône */
.news-card:hover .news-link:after {
  	content: url('data:image/svg+xml;utf8,%0A%3Csvg%20width%3D%2214%22%20height%3D%2213%22%20viewBox%3D%220%200%2014%2013%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%0A%3Cpath%20d%3D%22M12.3403%201.3698L2%2011.7101M5.35114%201L12.71%201.00001L12.71%208.35886%22%20stroke%3D%22%23F0676E%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22square%22%20stroke-linejoin%3D%22round%22/%3E%0A%3C/svg%3E%0A'); /* Icône pink au survol */
}

.view-all-news {
    display: flex;
    justify-content: right; /* Centre horizontalement */
    margin-top: 16px;
}

/*----------------------------------------------------------------------------*/
/* Media queries for responsive design for tje news card */
@media (min-width: 851px) {
    .news-card {
        width: 24%; /* Four cards per row on small laptops */
    }
}

@media (max-width: 850px) {
    .news-card {
        width: 49%; /* One card per row on small phones */
    }
}

@media (max-width: 550px) {
    .news-card {
        width: 100%; /* One card per row on small phones */
    }
}

/*----------------------------------------------------------------------------*/
/* CSS FOR ARCHIVE */
.news-gallery-archive {
    display: flex;
    flex-wrap: wrap;
	justify-content: left;
    column-gap: 1%;
}