/* 
 * Heroicons pour DESTINS CROISÉS
 * Heroicons est une bibliothèque d'icônes moderne et élégante créée par Tailwind CSS
 * Site officiel : https://heroicons.com
 * Documentation : https://heroicons.com
 * 
 * Note : Heroicons utilise des SVG inline directement dans le HTML
 * Ce fichier CSS contient des classes utilitaires pour faciliter l'utilisation
 */

/* Classes de base pour les icônes Heroicons */
.heroicon {
    display: inline-block;
    vertical-align: middle;
    flex-shrink: 0;
}

/* Tailles prédéfinies */
.heroicon-xs {
    width: 16px;
    height: 16px;
}

.heroicon-sm {
    width: 20px;
    height: 20px;
}

.heroicon-md {
    width: 24px;
    height: 24px;
}

.heroicon-lg {
    width: 32px;
    height: 32px;
}

.heroicon-xl {
    width: 38px;
    height: 38px;
}

.heroicon-2xl {
    width: 50px;
    height: 50px;
}

.heroicon-3xl {
    width: 60px;
    height: 60px;
}

/* Couleurs personnalisées pour DESTINS CROISÉS */
.heroicon-primary {
    stroke: #671F2A;
    fill: none;
}

.heroicon-primary-solid {
    fill: #671F2A;
}

.heroicon-secondary {
    stroke: #FFD700;
    fill: none;
}

.heroicon-secondary-solid {
    fill: #FFD700;
}

.heroicon-white {
    stroke: #ffffff;
    fill: none;
}

.heroicon-white-solid {
    fill: #ffffff;
}

.heroicon-gray {
    stroke: #333333;
    fill: none;
}

.heroicon-gray-solid {
    fill: #333333;
}

/* Classes de compatibilité pour migration depuis Flaticon */
/* Ces classes peuvent être utilisées pour faciliter la transition */

.icon-phone,
.flaticon-phone {
    display: inline-block;
}

.icon-email,
.flaticon-email {
    display: inline-block;
}

.icon-location,
.flaticon-location {
    display: inline-block;
}

.icon-facebook,
.flaticon-facebook {
    display: inline-block;
}

.icon-linkedin,
.flaticon-linkedin {
    display: inline-block;
}

.icon-instagram,
.flaticon-instagram {
    display: inline-block;
}

.icon-arrow-right,
.flaticon-arrow-right {
    display: inline-block;
}

.icon-arrow-up,
.flaticon-arrow-up {
    display: inline-block;
}

.icon-star,
.flaticon-star {
    display: inline-block;
}

.icon-envelope,
.flaticon-envelope {
    display: inline-block;
}

/* Utilitaires pour les icônes dans les boutons */
.icon-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.icon-button .heroicon {
    margin-right: 0;
}

/* Utilitaires pour les icônes dans les listes */
.icon-list {
    display: flex;
    align-items: center;
    gap: 12px;
}

.icon-list .heroicon {
    flex-shrink: 0;
}

/* Animation pour les icônes interactives */
.heroicon-hover {
    transition: all 0.3s ease;
}

.heroicon-hover:hover {
    transform: scale(1.1);
}

/* Styles pour les icônes dans le footer */
.footer-icon-wrap .heroicon {
    width: 38px;
    height: 38px;
}

.foot-icon.heroicon {
    width: 26px;
    height: 26px;
}

/* Styles pour les icônes de contact */
.contact-info-icon.heroicon {
    width: 60px;
    height: 60px;
}
