/* TMB Navigation SEO 0.2.9 — every rule is scoped to .tmb-nav, no global WooCommerce styles. */
.tmb-nav {box-sizing:border-box;width:100%;max-width:100%;margin:14px 0 22px;clear:both;font-family:inherit;}
.tmb-nav--archive {display:block;flex:0 0 100%;align-self:stretch;min-width:0;max-width:100%;clear:both;}
.tmb-nav *, .tmb-nav *::before, .tmb-nav *::after {box-sizing:border-box;}
.tmb-nav__top {display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;}
.tmb-nav .tmb-nav__heading {font-size:clamp(15px,1.4vw,19px);line-height:1.35;font-weight:650;margin:0;padding:0;text-transform:none;letter-spacing:normal;}
.tmb-nav__controls {display:flex;gap:7px;flex-shrink:0;}
.tmb-nav .tmb-nav__arrow {display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:32px;border-radius:50%;border:1px solid #ccc;background:#fff;color:#222;cursor:pointer;padding:0;font-size:18px;line-height:1;box-shadow:none;}
.tmb-nav .tmb-nav__arrow:hover {border-color:#555;background:#f9f9f9;}
.tmb-nav .tmb-nav__arrow:disabled {opacity:.35;cursor:default;}
.tmb-nav :is(.tmb-nav__arrow,.tmb-nav__item,.tmb-nav__track):focus-visible {outline:2px solid #2659ac;outline-offset:2px;}
/* 0.2.5: scroll-padding-inline-start (already on mobile since 0.2.2) also on desktop: without it, snapping
   started an overflowing track at scrollLeft 3 px, so the "previous" arrow looked active at the start. */
.tmb-nav__track {display:flex;gap:12px;width:100%;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline-start:3px;scrollbar-width:thin;padding:3px 3px 10px;-webkit-overflow-scrolling:touch;}
.tmb-nav .tmb-nav__item {flex:0 0 96px;width:96px;max-width:96px;display:flex;align-items:center;flex-direction:column;gap:6px;text-align:center;text-decoration:none;color:inherit;scroll-snap-align:start;box-shadow:none;padding:0;}
.tmb-nav .tmb-nav__item:hover .tmb-nav__label {text-decoration:underline;text-underline-offset:2px;}
.tmb-nav__photo {width:92px;height:92px;flex:0 0 92px;display:block;overflow:hidden;border-radius:50%;background:#f5f5f5;border:1px solid #e7e7e7;}
.tmb-nav .tmb-nav__img {display:block;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:50%;margin:0;padding:0;}
.tmb-nav .tmb-nav__label {font-size:12px;line-height:1.32;font-weight:550;overflow-wrap:normal;word-break:normal;hyphens:none;white-space:normal;}
.tmb-nav__photo--empty {background:#f4f4f4;}
/* 0.2.4: center the tiles only in the manually-inserted homepage carousel on desktop.
   "safe center" falls back to the start if the tiles overflow the track,
   keeping the first tile accessible. Archives, product pages and mobile stay untouched. */
@media (min-width:768px) {
 body.home .tmb-nav:not(.tmb-nav--archive) .tmb-nav__track {justify-content:safe center;}
}
@media (max-width:767px) {
 .tmb-nav {margin:12px 0 16px;}
 /* Hide the mobile scrollbar only; preserve native horizontal swiping and keyboard focus. */
 /* 0.2.3: the track is a size container so tile widths follow the carousel's real width (cqi). */
 .tmb-nav__track {gap:11px;padding:3px 3px 4px;scrollbar-width:none;-ms-overflow-style:none;scroll-padding-inline-start:3px;container-type:inline-size;}
 .tmb-nav__track::-webkit-scrollbar {display:none;width:0;height:0;}
 /* 0.2.3: 3 whole tiles + about 40 % of the 4th one visible (0.2.2 = 27vw: the 4th photo stayed hidden).
    1st declarations = fallback (16px page padding assumed); 2nd = container units, ignored by old browsers. */
 .tmb-nav .tmb-nav__item {flex:0 0 clamp(88px,calc((100vw - 68px) / 3.4),116px);width:clamp(88px,calc((100vw - 68px) / 3.4),116px);max-width:116px;}
 .tmb-nav .tmb-nav__item {flex-basis:clamp(88px,calc((100cqi - 30px) / 3.4),116px);width:clamp(88px,calc((100cqi - 30px) / 3.4),116px);}
 .tmb-nav__photo {width:80px;height:80px;flex-basis:80px;}
 .tmb-nav .tmb-nav__label {font-size:12px;line-height:1.35;min-height:2.7em;overflow-wrap:normal;word-break:normal;hyphens:none;}
 .tmb-nav__controls {display:none;}
}
@media (prefers-reduced-motion:reduce) {.tmb-nav__track {scroll-behavior:auto;}}

/* 0.2.6 — Native product category/tag metadata enhancement, independently opt-in.
 * This CSS targets the actual WooCommerce .product_meta element and its existing
 * .posted_in / .tagged_as / .sku_wrapper markup. It DOES NOT create, replace,
 * re-order or hide any links, terms, tags, punctuation, labels or SKU.
 * No global WooCommerce styles are modified. */
/* 0.2.9: no width, max-width, margin, clear or side padding here any more. The theme keeps
   placing and sizing .product_meta itself (Shoptimizer offsets it to the right half: the forced
   width:100% of 0.2.6-0.2.8 pushed the block and its right-aligned links off-screen). */
body.single-product.tmb-navseo-meta-enabled .product_meta {
    padding-top:18px;
    padding-bottom:4px;
    border-top:1px solid #e5e5e5;
    font-family:inherit;
    font-size:13px;
    line-height:1.8;
    overflow-wrap:anywhere;
}
body.single-product.tmb-navseo-meta-enabled .product_meta .tmb-navseo-meta-heading {
    font-family:inherit;
    font-size:clamp(15px,1.3vw,18px);
    line-height:1.35;
    font-weight:650;
    text-transform:none;
    letter-spacing:normal;
    color:inherit;
    margin:0 0 12px;
    padding:0;
}
body.single-product.tmb-navseo-meta-enabled .product_meta :is(.posted_in,.tagged_as,.sku_wrapper) {
    display:block;
    clear:both;
    max-width:100%;
    margin:0 0 10px;
    padding:0;
    font-size:inherit;
    line-height:1.75;
    overflow-wrap:anywhere;
}
/* Category pills reuse native WooCommerce <a> elements, including their original
   commas between terms. The separator text nodes are intentionally untouched. */
body.single-product.tmb-navseo-meta-enabled .product_meta .posted_in a {
    display:inline-block;
    vertical-align:baseline;
    max-width:100%;
    margin:2px 1px;
    padding:4px 9px;
    border:1px solid #dfdfdf;
    border-radius:999px;
    background:#f7f7f7;
    color:#222;
    font-size:inherit;
    line-height:1.55;
    font-weight:550;
    text-decoration:none;
    box-shadow:none;
    white-space:normal;
    overflow-wrap:anywhere;
}
body.single-product.tmb-navseo-meta-enabled .product_meta .posted_in a:hover {
    background:#eee;
    border-color:#bfbfbf;
    text-decoration:underline;
    text-underline-offset:2px;
}
/* 0.2.7 — Distinct navigation for existing product tags.
   Neither categories nor tags are recreated: the native WooCommerce anchors,
   comma separators, labels, hrefs and term order remain in the DOM. */
body.single-product.tmb-navseo-meta-enabled .product_meta .tmb-navseo-meta-themes-heading {
    display:block; /* 0.2.9: was flex, which kept this title on the left when the theme right-aligns */
    margin:17px 0 10px;
    padding:14px 0 0;
    border-top:1px solid #e8e8e8;
    font-family:inherit;
    font-size:clamp(14px,1.15vw,16px);
    line-height:1.4;
    font-weight:650;
    text-transform:none;
    letter-spacing:normal;
    color:inherit;
}
/* 0.2.8: decorative tag icon drawn in SVG instead of the 🏷 emoji: same look on iPhone, Android
   and Windows (the emoji is a coloured picture on iOS) and not read aloud by screen readers. */
body.single-product.tmb-navseo-meta-enabled .product_meta .tmb-navseo-meta-themes-heading::before {
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%235f6b78' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M3 4.5v6.3c0 .5.2 1 .6 1.4l8.2 8.2a2 2 0 0 0 2.8 0l5.9-5.9a2 2 0 0 0 0-2.8l-8.2-8.2A2 2 0 0 0 10.8 3H4.5A1.5 1.5 0 0 0 3 4.5z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1.5'/%3E%3C/svg%3E");
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%235f6b78' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M3 4.5v6.3c0 .5.2 1 .6 1.4l8.2 8.2a2 2 0 0 0 2.8 0l5.9-5.9a2 2 0 0 0 0-2.8l-8.2-8.2A2 2 0 0 0 10.8 3H4.5A1.5 1.5 0 0 0 3 4.5z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1.5'/%3E%3C/svg%3E") / "";
    display:inline-block;
    margin-right:7px;
    vertical-align:-2px;
    line-height:1;
}
/* CSS fallback if JavaScript is blocked. It is merely a visual caption;
   the native "Étiquette :" remains readable and the links remain usable. */
body.single-product.tmb-navseo-meta-enabled .product_meta .tagged_as:not(.tmb-navseo-themes-title-ready)::before {
    content:"Explorer par thème";
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%235f6b78' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M3 4.5v6.3c0 .5.2 1 .6 1.4l8.2 8.2a2 2 0 0 0 2.8 0l5.9-5.9a2 2 0 0 0 0-2.8l-8.2-8.2A2 2 0 0 0 10.8 3H4.5A1.5 1.5 0 0 0 3 4.5z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1.5'/%3E%3C/svg%3E") "\00a0\00a0 Explorer par thème" / "Explorer par thème";
    display:block;
    margin:15px 0 10px;
    padding:14px 0 0;
    border-top:1px solid #e8e8e8;
    font-family:inherit;
    font-size:15px;
    font-weight:650;
    line-height:1.45;
}
/* When there are only tags, the PHP H2 already labels the section. */
body.single-product.tmb-navseo-meta-enabled .product_meta .tmb-navseo-meta-heading--tags-only ~ .tagged_as::before {
    content:none;
}
body.single-product.tmb-navseo-meta-enabled .product_meta .tagged_as {
    color:inherit;
    opacity:1;
}
/* Tag links are now clear, tappable navigation chips, visually distinct from
   the rounder category pills. The complete original anchor text stays visible. */
body.single-product.tmb-navseo-meta-enabled .product_meta .tagged_as a {
    display:inline-block;
    vertical-align:middle;
    max-width:min(100%,440px);
    margin:4px 3px 4px 0;
    padding:7px 11px;
    border:1px solid #d9e0e6;
    border-radius:9px;
    background:#f5f7f9;
    color:#253347;
    font-size:inherit;
    font-weight:500;
    line-height:1.45;
    text-decoration:none;
    box-shadow:none;
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:normal;
    text-align:left; /* 0.2.9: multi-line tag text stays readable in a right-aligned block */
}
body.single-product.tmb-navseo-meta-enabled .product_meta .tagged_as a:hover {
    border-color:#a9b5c2;
    background:#edf1f5;
    text-decoration:underline;
    text-underline-offset:2px;
}
body.single-product.tmb-navseo-meta-enabled .product_meta a:focus-visible {
    outline:2px solid #2659ac;
    outline-offset:2px;
}
@media (max-width:767px) {
    body.single-product.tmb-navseo-meta-enabled .product_meta {
        padding-top:14px;
        padding-bottom:3px;
        font-size:12px;
    }
    body.single-product.tmb-navseo-meta-enabled .product_meta .posted_in a {
        padding:5px 8px;
        margin:3px 1px;
    }
}
/* 0.2.8: the native ", " separators between links are wrapped server-side in .tmb-navseo-sep
   (see wrap_meta_separators() in the PHP). They stay in the HTML and in the text (font-size:0, not
   display:none) but take no room, so no comma dangles after a pill or at the start of a line;
   a 6px gap separates the pills instead.
   Browsers without :has() keep the 0.2.7 rendering (commas visible). */
@supports selector(a:has(+ b)) {
    body.single-product.tmb-navseo-meta-enabled .product_meta .tmb-navseo-sep {
        font-size:0;
    }
    body.single-product.tmb-navseo-meta-enabled .product_meta :is(.posted_in,.tagged_as) a:has(+ .tmb-navseo-sep) {
        margin-right:6px;
    }
}