/*
 Theme Name:   Bootscore Child
 Description:  Bootscore Child Theme
 Author:       Bootscore
 Author URI:   https://bootscore.me
 Template:     bootscore
 Version:      6.0.0
 Requires at least: 5.0
 Tested up to: 6.6
 Requires PHP: 7.4
 License: MIT License
 License URI: https://github.com/bootscore/bootscore-child/blob/main/LICENSE
 Text Domain:  bootscore
*/

/* 
All style editing is done via /assets/scss/_bootscore_custom.scss
*/




/* ==========================================================================
   1. Settings – Variables, fonts, etc.
   ========================================================================== */

    :root{
        --color-1: #143481;
        --color-2: #F6D132;
    }



/* ==========================================================================
   3. Base – Éléments HTML bruts
   ========================================================================== */

   body{
      font-family: 'Roboto';
      font-weight: 500;
      background-color: rgba(248, 249, 250);
	  color: #484848;
   }

   h1, h2 {
      font-family: "Roboto Slab", serif;
   }
   
   h3 {
		font-weight: 300;
		color: var(--color-1)!important;
   }
   
   h3, h4, h5, h6{
      font-family: "Open Sans", sans-serif;
   }

/* ==========================================================================
   4. Layout – Grilles, containers, colonnes, structure globale
   ========================================================================== */

   /* Dimension des container */

    @media (min-width: 1550px) {
    .container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl {
        max-width: 1500px;
    }
    }

    @media (min-width: 1650px) {
    .container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl {
        max-width: 1600px;
    }
    }


/* ==========================================================================
   5. Components – Boutons, cartes, modals, etc.
   ========================================================================== */

    :root {
  --color-1: #143481;
  --color-2: #F6D132;
}

/* Bouton de base */
.btn {
  padding: 0.75rem 1.25rem;
  border-radius: 0.25rem;
  border: none;
  text-decoration: none;
  cursor: pointer;
  font-weight: 600;
  transition: all 0.3s ease;
}

/* ================================
   1. Bouton plein color-1 (zoom léger au hover)
   ================================ */
.btn.bg-color-1 {
  background-color: var(--color-1);
    border: 2px solid var(--color-1);
  color: #fff;
}

.btn.bg-color-1:hover {
  transform: scale(1.02);
  box-shadow: 0 4px 12px rgba(20, 52, 129, 0.3);
}

/* ================================
   2. Bouton plein color-2 (animation "pulse" au hover)
   ================================ */
.btn.bg-color-2 {
  background-color: var(--color-2);
  color: #000;
}

.btn.bg-color-2:hover {
  animation: pulse-bg 0.6s ease-in-out;
}

@keyframes pulse-bg {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.03); }
  100% { transform: scale(1); }
}

/* ================================
   3. Bouton outline color-1 (effet remplissage survol)
   ================================ */
.btn-outline-color-1 {
  background-color: transparent;
  border: 2px solid var(--color-1);
  color: var(--color-1);
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.btn-outline-color-1::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: var(--color-1);
  z-index: -1;
  transition: all 0.3s ease;
}

.btn-outline-color-1:hover {
  color: #fff;
  border: 2px solid var(--color-1);
}

.btn-outline-color-1:hover::before {
  left: 0;
}

.btn-card { 
   position: relative; 
   display: inline-block; 
   padding: 0.5rem 1rem; 
   border-radius: 0.25rem; 
   color: black; 
   font-weight: 600; 
   text-decoration: none; 
   overflow: hidden; 
   transition: all 0.3s ease; } /* Ajout de la flèche avec ::after */ 
   
.btn-card::after { 
   content: "→"; 
   position: absolute; 
   right: 16px; 
   opacity: 0; 
   transform: translateX(-5px);
   transition: all 0.3s ease; } /* Animation au survol */ 
   
.btn-card:hover { 
   padding-right: 36px; /* laisse de la place pour la flèche */ } 

.btn-card:hover::after { 
   opacity: 1; 
   transform: translateX(0); }



/* ==========================================================================
   6. Sections – Styles propres à des pages ou sections spécifiques
   ========================================================================== */

   #masthead .nav-link{
      font-family: 'Roboto';
      text-transform: uppercase !important;
      color: var(--color-1);
   }

   #masthead .nav-link.active{
      text-transform: uppercase !important;
      color: var(--color-2);
   }

   #masthead .nav-link:hover{
      text-transform: uppercase !important;
      color: var(--color-2);
   }

   .wpcf7-spinner{
      display: none;
   }

/* ==========================================================================
   7. Utilities – Helpers, classes utilitaires
   ========================================================================== */
   
    .bg-color-1{ background-color: var(--color-1) !important; color:white !important;}
    .bg-color-2{ background-color: var(--color-2) !important;}
    .bg-color-1-gradient{ background: linear-gradient(90deg,rgba(20, 52, 129, 1) 0%, rgba(72, 89, 132, 1) 100%) !important; }

    .text-color-1{ color: var(--color-1) !important;}
    .text-color-2{ color: var(--color-2) !important;}
    
    .font-roboto{
      font-family: 'Roboto' !important;
    }

    .font-pacifico{
      font-family: "Pacifico", cursive;!important;
    }