#case-studies-container {
    display: flex;              /* Use flexbox for centering */
    justify-content: center;    /* Center horizontally */
}

#case-studies-container .card-blog-img:hover .btn {
    opacity: 1; /* Rendre le bouton visible au survol */
    transform: translate(-50%, -50%) scale(1.1); /* Agrandir légèrement */
}

#case-studies-container .btn-icon-only.btn-round {
    border-radius: 50%; /* Bord arrondi */
    background-color: rgba(219, 28, 27, 0.8); /* Arrière-plan semi-transparent */
    border: none; /* Pas de bordure */
}

#case-studies-container h2 {
    font-size: 1.5rem;
    padding-bottom: 1.5rem !important;
    color: #26639e;
}

#case-studies-filter-form .form-select,
#case-studies-filter-form .clear-btn {
  height: 2rem;
  padding: 0 0.75rem;   /* padding horizontal seulement */
  line-height: 2rem;    /* centre le texte sans flex */
}

.cs-industry{
}
#case-studies-container select {
    display: inline-block; /* Affichage en ligne */
    font-weight: 400; /* Poids de la police */
    border-radius: 1.3125rem; /* Bord arrondi */
    line-height: 1.5; /* Hauteur de ligne */
    color: #717171; /* Couleur du texte */
    padding: 0.375rem 1.125rem; /* Espacement interne */
    border: 2px solid #e0e0e0; /* Bordure */
    vertical-align: middle; /* Alignement vertical */
    background: url(../Blog-ProQC/assets/svg/caret-down.svg) right 1.125rem center / 11px 14px no-repeat; /* Arrière-plan */
    -webkit-appearance: none; /* Suppression de l'apparence par défaut pour WebKit */
    -moz-appearance: none; /* Suppression de l'apparence par défaut pour Firefox */
    appearance: none; /* Suppression de l'apparence par défaut */
    background-color: transparent; /* Fond transparent */
}
#case-studies-container .card-blog-img {
    position: relative; /* Assurez-vous que le conteneur est positionné */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 263px; /* Assurez-vous que la hauteur est stable */
}

/* Styles pour le bouton */
#case-studies-container .btn-icon-only {
    margin: 0;
    color: #fff; /* Couleur de l'icône */
    font-size: .875rem; /* Taille de l'icône */
    position: absolute; /* Permet de positionner le bouton par rapport à son parent */
    top: 50%; /* Aligne le bouton verticalement au centre */
    left: 50%; /* Aligne le bouton horizontalement au centre */
    transform: translate(-50%, -50%); /* Recentre le bouton */
    width: 42px; /* Largeur fixe */
    height: 42px; /* Hauteur fixe */
    padding: 0; /* Aucune marge */
    display: flex; /* Utiliser flexbox */
    justify-content: center; /* Centre l'icône horizontalement */
    align-items: center; /* Centre l'icône verticalement */
    opacity: 0; /* Rendre le bouton invisible par défaut */
    transition: opacity 0.2s ease-in-out; /* Transition fluide pour l'opacité */
}

#case-studies-container .card-blog-img:hover .btn-icon-only {
    opacity: 1; /* Affiche le bouton lorsque l'utilisateur survole l'image */
}

#case-studies-filter-form .form-select {
padding-top: 5px !important;
    display: inline-block;
    font-weight: 400;
    line-height: 1.5;
    color: #717171;
    padding: 0.375rem 1.125rem;
    border: 2px solid #ccc;
    vertical-align: middle;
    height: 2.575rem;
    margin-bottom: 15px;
    background-color: transparent !important;
    background: transparent url(https://proqc.com/blog/wp-content/themes/Blog-ProQC/assets/svg/caret-down.svg) no-repeat right 1.125rem center / 11px 14px;
    border-radius: 50px !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 13px;
    word-wrap: normal;
}
#case-studies-filter-form .btn {
    padding: 0.6rem 3rem !important;
    font-size: .875rem;
    margin-top: -15px;
}
#case-studies-filter-form .clear-btn {
  display: inline-flex;
  align-items: center;   /* centre le texte verticalement */
  justify-content: center;
  height: auto;          /* ajuste la hauteur au padding */
  padding: 0.375rem 1rem;/* même padding vertical que .form-select */
  margin: 0;             /* supprimez votre margin-top:5px */
  margin-left: 0.5rem;   /* espace à gauche si besoin */
  font-size: .75rem;
  border-radius: 1.3125rem;
}

/* Responsive design for mobile */
@media (max-width: 575.98px) {
    #case-studies-filter-form .form-select {
        width: 100%; /* Full width on mobile */
    }
}
#case-studies-filter-form .form-select:focus{border-color:#26639e;box-shadow:0 0 8px 0 rgba(0,0,0,.2)}

/* Centering the spinner */
.spinner-container {
    display: flex;             /* Use flexbox for centering */
    justify-content: center!important;   /* Center horizontally */
    margin: 20px 0;           /* Optional: Add some vertical space */
}

.justify-content-center {
    justify-content: center !important;
}

/* Spinner Loader */
.spinner-border {
    display: inline-block;
    width: 2rem;
    height: 2rem;
    vertical-align: -.125em;
    border: .25em solid #85c1e9; /* Couleur de l'arrière-plan */
    border-right-color: transparent;
    border-radius: 50%; /* Pour le rendre rond */
    animation: spin 0.75s linear infinite; /* Animation de rotation */
}

/* Animation de rotation */
@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Hidden text for accessibility */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap; /* Prevents text from wrapping */
    clip-path: inset(50%); /* Visually hide the element */
}

.post-category {
    font-size: 12px;
    text-transform: uppercase;
    color: #717171;
}

.post-category a {
    color: inherit; /* Inherit color from parent */
    text-decoration: none; /* Remove underline */
}