/*
Theme Name: OceanWP Child
Theme URI: https://www.crazygoat.fr
Description: Thème enfant personnalisé basé sur OceanWP pour le site Crazy Goat
Author: Crazy Goat
Author URI: https://www.crazygoat.fr
Template: oceanwp
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: child theme, oceanwp, crazy goat
Text Domain: oceanwp-child
*/

/*================================
	Page mon compte
  ================================*/

/* ===============================
   Pied de page principal
   =============================== */
footer.crazy-footer {
  margin-bottom: 0; /* Évite tout espace inutile sous le footer */
  padding-bottom: 0;
  background: #047c5b; /* Vert Crazy Goat – couleur de fond */
  color: #f2f2f2; /* Couleur claire pour le texte */
  padding: 40px 20px; /* Espace intérieur : 40px vertical, 20px horizontal */
  font-family: 'Montserrat', sans-serif; /* Police moderne et lisible */
}

/* Empêche le dernier élément du body de générer un espace vide */
body > *:last-child {
  margin-bottom: 0 !important;
}

/* ===============================
   Conteneur des colonnes
   =============================== */
.footer-wrapper {
  display: flex; /* Active le mode flexbox */
  flex-direction: column; /* Empile les éléments verticalement (mobile) */
  gap: 30px; /* Espace entre les colonnes */
  max-width: 1200px; /* Limite la largeur du footer */
  margin: auto; /* Centre le bloc horizontalement */
}

/* ===============================
   Colonnes individuelles
   =============================== */
.footer-col {
  text-align: center; /* Centre le contenu (mobile) */
}

/* Titres des colonnes (ex: Navigation, À propos) */
.footer-col h4 {
  font-size: 18px; /* Taille du titre */
  margin-bottom: 15px; /* Espace sous le titre */
  color: #ff6600; /* Orange vif Crazy Goat */
  text-transform: uppercase; /* Met en majuscules */
  letter-spacing: 1px; /* Espacement entre lettres */
}

/* ===============================
   Liste des liens (sans puces)
   =============================== */
.footer-col ul {
  list-style: none; /* Supprime les puces */
  padding: 0; /* Supprime l’indentation */
}

/* Espacement entre chaque élément de la liste */
.footer-col ul li {
  margin: 10px 0;
}

/* Style des liens */
.footer-col ul li a {
  color: #f2f2f2; /* Blanc cassé */
  text-decoration: none; /* Supprime le soulignement */
  transition: color 0.3s; /* Effet doux au survol */
}

/* Couleur au survol */
.footer-col ul li a:hover {
  color: #ffcc00; /* Jaune Crazy Goat */
}

/* ===============================
   Bloc Réseaux sociaux
   =============================== */
.socials {
  display: flex; /* Aligne horizontalement les icônes */
  justify-content: center; /* Centre les icônes */
  gap: 25px; /* Espace entre chaque bouton */
  margin-top: 15px; /* Espacement au-dessus des icônes */
  margin-bottom: 15px; /* Ajoute de l’espace sous les logos */
}
/* === Icône Instagram === */
.instagram-icon {
  background-color: #ffffff;
  border-radius: 50%;
  width: 55px;
  height: 55px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s, box-shadow 0.3s;
}

.instagram-icon i {
  color: #E1306C !important; /* Rose Instagram */
  font-size: 48px;
}

.instagram-icon:hover {
  transform: scale(1.5);
  box-shadow: 0 0 10px rgba(225, 48, 108, 0.4);
}


/* === Icône Facebook === */
.facebook-icon {
  background-color: #1877F2 !important; /* Bleu Facebook */
  border-radius: 50%;
  width: 55px;
  height: 55px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s, box-shadow 0.3s;
}

.facebook-icon i {
  color:  #ffffff;
  font-size: 45px;
}

.facebook-icon:hover {
  transform: scale(1.5);
  box-shadow: 0 0 10px rgba(24, 119, 242, 0.4);
}
/* === Icône Youtube === */
.youtube-icon {
  background-color: #ffffff;      /* Fond blanc */
  color: #FF0000 !important;                 /* Rouge YouTube */
  border-radius: 50%;             /* Rend le fond parfaitement rond */
  width: 55px;
  height: 55px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 45px;                /* Taille de l’icône */
  transition: transform 0.3s ease, box-shadow 0.3s;
}

.youtube-icon:hover {
  transform: scale(1.5);
  box-shadow: 0 0 10px rgba(255, 0, 0, 0.4); /* Effet lumineux au survol */
}

/* ===============================
   Zone du copyright
   =============================== */
.footer-bottom {
  text-align: center; /* Centrage du texte */
  margin: 0; /* Supprime les marges */
  padding: 10px 0; /* Espace haut/bas */
  font-size: 14px; /* Petite taille de texte */
  color: #999; /* Gris clair */
  border-top: 1px solid #444; /* Ligne séparatrice */

}

/* ===============================
   Responsive : mise en ligne des colonnes sur grand écran
   =============================== */
@media (min-width: 768px) {
  .footer-wrapper {
    flex-direction: row; /* Passe en disposition horizontale */
    justify-content: space-between; /* Équilibre l'espacement */
  }

  .footer-col {
    width: 30%; /* Chaque colonne occupe 1/3 de l'espace */
    text-align: left; /* Texte aligné à gauche */
  }
	.footer-col:last-child {
  align-items: center;
  text-align: center;
}
html, body {
  margin: 0 !important;
  padding: 0 !important;
  height: 100%;
}

footer.crazy-footer {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.footer-bottom {
  margin-bottom: 0 !important;
  padding-bottom: 1px;

body > *:last-child {
  margin-bottom: 0 !important;
}
/* ===============================
   Correction pour conteneurs WordPress
   =============================== */
#page,
.site,
.content-area,
.wrapper {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
