/* ============================================================
   ALLERGÈNES — Pastilles picto
   Utilisé sur la page boutique (ordering-food) et la fiche produit
   ============================================================ */

.of-allergen-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 8px 0 4px;
}

/* Pastille ronde */
.of-allergen-badge {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    cursor: default;
    flex-shrink: 0;
    transition: transform 0.15s ease;
}

.of-allergen-badge:hover {
    transform: scale(1.18);
    z-index: 5;
}

/* Tooltip */
.of-allergen-badge::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 7px);
    left: 50%;
    transform: translateX(-50%);
    background: #1a1a1a;
    color: #fff;
    font-size: 0.7rem;
    font-weight: 600;
    white-space: nowrap;
    padding: 3px 8px 4px;
    border-radius: 5px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.15s ease;
    z-index: 100;
    font-family: inherit;
    letter-spacing: 0;
    line-height: 1.5;
}

.of-allergen-badge::before {
    content: '';
    position: absolute;
    bottom: calc(100% + 3px);
    left: 50%;
    transform: translateX(-50%);
    border: 4px solid transparent;
    border-top-color: #1a1a1a;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.15s ease;
    z-index: 100;
}

.of-allergen-badge:hover::after,
.of-allergen-badge:hover::before {
    opacity: 1;
}

/* ── Carte ordering-food : entre l'image et le nom ── */
.ordering-food-product-card .of-allergen-badges {
    padding: 8px 12px 2px;
    gap: 4px;
}

/* ── Fiche produit WooCommerce : sous le titre ── */
.woocommerce-product-allergens {
    margin: 0 0 10px;
}

.woocommerce-product-allergens .of-allergen-badges {
    padding: 4px 0 6px;
    gap: 6px;
}

.woocommerce-product-allergens .of-allergen-badge {
    width: 32px;
    height: 32px;
}