/* ==================================================
   ICÔNES ET EMOJIS EN CSS - MODE HORS LIGNE
   Remplace les emojis natifs par des symboles CSS
   ================================================== */

/* Style de base pour les icônes en pseudo-éléments */
.icon-fallback {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-style: normal;
    font-weight: 400;
}

/* ==================================================
   ICÔNES POUR LE HEADER
   ================================================== */

/* Téléphone → Icône SVG "call center" gérée directement dans le HTML (header-top) */

/* Email ✉ → Remplacer par symbole Unicode stable */
.contact-info span:nth-child(2)::before {
    content: "✉ ";
    font-family: Arial, sans-serif;
}

/* Localisation 📍 → Remplacer par symbole Unicode stable */
.contact-info span:nth-child(3)::before {
    content: "📍 ";
    font-family: Arial, sans-serif;
}

/* ==================================================
   SOLUTION ALTERNATIVE - SVG INLINE
   Pour les navigateurs qui ne supportent pas bien Unicode
   ================================================== */

/* Téléphone en SVG */
.phone-icon::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M20 15.5c-1.2 0-2.4-.2-3.6-.6-.3-.1-.7 0-1 .2l-2.2 2.2c-2.8-1.4-5.1-3.8-6.6-6.6l2.2-2.2c.3-.3.4-.7.2-1-.3-1.1-.5-2.3-.5-3.5 0-.6-.4-1-1-1H4c-.6 0-1 .4-1 1 0 9.4 7.6 17 17 17 .6 0 1-.4 1-1v-3.5c0-.6-.4-1-1-1z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 4px;
}

/* Email en SVG */
.email-icon::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 4px;
}

/* Localisation en SVG */
.location-icon::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 2C8.1 2 5 5.1 5 9c0 5.2 7 13 7 13s7-7.8 7-13c0-3.9-3.1-7-7-7zm0 9.5c-1.4 0-2.5-1.1-2.5-2.5s1.1-2.5 2.5-2.5 2.5 1.1 2.5 2.5-1.1 2.5-2.5 2.5z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 4px;
}

/* ==================================================
   ICÔNE PANIER 🛒
   ================================================== */

.cart-icon::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zM1 2v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.14 0-.25-.11-.25-.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.58-6.49c.08-.14.12-.31.12-.48 0-.55-.45-1-1-1H5.21l-.94-2H1zm16 16c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}

/* ==================================================
   POLICES DE SECOURS POUR EMOJIS
   Utilise les meilleures polices système pour emojis
   ================================================== */

.emoji-fallback {
    font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 
                 'Noto Color Emoji', 'Android Emoji', sans-serif;
}

/* Appliquer aux éléments avec emojis */
.contact-info,
.hero-subtitle,
.footer-section {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 
                 'Apple Color Emoji', 'Segoe UI Emoji', sans-serif;
}