/* WP Labels - etiquettes produits, au dessin du site Wellputt.
   Pastilles (orange, noir, blanc, sable) : Oswald capitales, petit interlettrage.
   Texte (gris, noir) : les infos livraison / garantie, comme les anciennes « chips ». */

.wpl {
    list-style: none; margin: 0; padding: 0;
    display: flex; flex-wrap: wrap; gap: 6px;
}
.wpl__tag {
    display: inline-flex; align-items: center; gap: 6px;
    font-family: "Oswald", system-ui, sans-serif; font-weight: 500;
    font-size: 11px; line-height: 1.2; letter-spacing: 1.2px; text-transform: uppercase;
    white-space: nowrap;
}
.wpl__icon { flex: none; }

/* Pastilles */
.wpl__tag--accent,
.wpl__tag--ink,
.wpl__tag--light,
.wpl__tag--sand { padding: 6px 10px; border-radius: 2px; }
.wpl__tag--accent { background: #F15A29; color: #fff; }
.wpl__tag--ink { background: #1a1a1a; color: #fff; }
.wpl__tag--light { background: #fff; color: #1a1a1a; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12); }
.wpl__tag--sand { background: #f4f2ef; color: #1a1a1a; }

/* Texte */
.wpl__tag--muted { padding: 5px 9px; background: #f5f5f5; color: #8a8a8a; font-family: "Poppins", system-ui, sans-serif; font-weight: 600; font-size: 10.5px; letter-spacing: .6px; }
.wpl__tag--strong { padding: 5px 9px; background: #f5f5f5; color: #1a1a1a; font-family: "Poppins", system-ui, sans-serif; font-weight: 700; font-size: 10.5px; letter-spacing: .6px; }

/* Sur une photo : en haut a droite, en pile (les promotions natives restent a gauche). */
.wpl--mini_image,
.wpl--pdp_image {
    position: absolute; top: 12px; right: 12px; z-index: 3;
    flex-direction: column; align-items: flex-end;
    pointer-events: none;
}
.wpl--pdp_image { top: 18px; right: 18px; }
.wpl--pdp_image .wpl__tag { font-size: 12px; padding: 7px 12px; }

/* Sous un nom ou un titre */
.wpl--mini_name { margin: 8px 0 2px; }
.wpl--pdp_title { margin: 10px 0 4px; }
.wpl--mini_name .wpl__tag { white-space: normal; }

/* Conteneurs des photos : la pile se place par rapport a eux. Miniature du theme : seulement
   quand elle porte des etiquettes, pour ne pas deplacer ses propres elements positionnes. */
.wp-pdp__cover,
.wp-pcard__media,
.wp-mini__media,
.wp-lcard__media,
.product-miniature .thumbnail-container:has(> .wpl) { position: relative; }

@media (max-width: 575px) {
    .wpl--mini_image { top: 8px; right: 8px; }
    .wpl--mini_image .wpl__tag { font-size: 10px; padding: 5px 8px; letter-spacing: 1px; }
}