/* Offres de quantité des fiches. Le bloc d'achat est clair : encre sombre, un seul accent violet. */
kaching-bundle{display:block}
.ro-of{--ro-encre:#14162b;--ro-doux:#555a70;--ro-filet:#d9d9e6;--ro-fond:#f7f7fb;--ro-accent:#5146e6;--ro-teinte:#f1f0fe;--ro-vert:#166534;display:block;color:var(--ro-encre);font-variant-numeric:tabular-nums}
.ro-of *{box-sizing:border-box}
.ro-of .kaching-bundles__bars{display:grid;gap:10px;margin:0;padding:0}
.ro-of .kaching-bundles__bar{position:relative;display:block;min-width:0}
.ro-of .kaching-bundles__bars>.kaching-bundles__bar:nth-child(n+4):not(.kaching-bundles__bar--selected){display:none}
.ro-of .ro-of-tete{position:relative;display:flex;align-items:center;gap:12px;min-height:72px;padding:12px 14px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.ro-of .ro-of-radio{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.ro-of .ro-of-rond{flex:none;width:22px;height:22px;border-radius:50%;border:2px solid #8f93a8;background:#fff}
.ro-of .ro-of-num{display:none}
.ro-of .ro-of-num::before{content:attr(data-n)}
.ro-of .ro-of-img{flex:none;width:52px;height:52px;border-radius:8px;overflow:hidden;background:#fff}
.ro-of .ro-of-img:empty{display:none}
.ro-of .ro-of-img img{display:block;width:100%;height:100%;object-fit:contain}
.ro-of .ro-of-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ro-of .kaching-bundles__bar-title{font-size:16px;font-weight:600;line-height:1.25;color:var(--ro-encre)}
.ro-of .ro-of-unite{font-size:13px;line-height:1.3;color:var(--ro-doux)}
.ro-of .ro-of-unite:empty{display:none}
.ro-of .ro-of-prix{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:1px;text-align:right}
.ro-of .kaching-bundles__bar-price{font-size:18px;font-weight:700;line-height:1.2;color:var(--ro-encre);white-space:nowrap}
.ro-of .kaching-bundles__bar-full-price{font-size:13px;line-height:1.2;color:var(--ro-doux);white-space:nowrap}
.ro-of .kaching-bundles__bar-full-price:empty{display:none}
.ro-of .ro-of-badge[hidden]{display:none}
.ro-of .ro-of-eco{display:none}
.ro-of .ro-of-detail{display:none}
.ro-of .kaching-bundles__bar--selected>.ro-of-detail{display:block}
.ro-of .ro-of-radio:focus-visible~.ro-of-rond{outline:2px solid var(--ro-accent);outline-offset:2px}
/* couleurs : photos à toucher, le menu natif reste pour les scripts et le lecteur d'écran */
.ro-of .ro-of-couleurs{display:grid;gap:10px;padding:0 14px 12px}
.ro-of .ro-of-couleur{display:grid;gap:6px;min-width:0}
.ro-of .ro-of-libelle{font-size:13px;color:var(--ro-doux)}
.ro-of .ro-of-pastilles{display:flex;flex-wrap:wrap;gap:8px}
.ro-of .ro-of-pastille{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:4px 10px 4px 4px;border:1.5px solid var(--ro-filet);border-radius:10px;background:#fff;color:var(--ro-encre);font:inherit;font-size:14px;font-weight:500;cursor:pointer}
.ro-of .ro-of-pastille img{width:34px;height:34px;border-radius:6px;object-fit:cover;display:block}
.ro-of .ro-of-pastille.on{border-color:var(--ro-accent);box-shadow:inset 0 0 0 1px var(--ro-accent)}
.ro-of .ro-of-pastille:focus-visible{outline:2px solid var(--ro-accent);outline-offset:2px}
.ro-of .ro-of-chacune{display:grid;gap:10px;min-width:0}
.ro-of .ro-of-chacune[hidden]{display:none}
.ro-of .ro-of-lien{justify-self:start;min-height:44px;padding:0;border:0;background:none;color:var(--ro-accent);font:inherit;font-size:14px;font-weight:600;text-decoration:underline;cursor:pointer}
.ro-of .ro-of-pastille:disabled{opacity:.45;cursor:not-allowed}
.ro-of .kaching-bundles__bar-variant-select{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;font-size:16px}
/* article en plus */
.ro-of .ro-of-ajout{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 14px;border-top:1px solid var(--ro-filet);cursor:pointer}
.ro-of .ro-of-coche{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.ro-of .kaching-bundles__upsell__checkbox{flex:none;width:22px;height:22px;border:2px solid #8f93a8;border-radius:6px;background:#fff center/14px no-repeat}
.ro-of .kaching-bundles__upsell__checkbox--selected{background-color:var(--ro-accent);border-color:var(--ro-accent);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E")}
.ro-of .ro-of-coche:focus-visible+.kaching-bundles__upsell__checkbox{outline:2px solid var(--ro-accent);outline-offset:2px}
.ro-of .ro-of-ajout img{flex:none;width:36px;height:36px;border-radius:6px;object-fit:cover}
.ro-of .ro-of-ajout-nom{flex:1;min-width:0;font-size:14px;line-height:1.3}
.ro-of .ro-of-ajout-prix{flex:none;display:flex;flex-direction:column;align-items:flex-end;font-size:14px;font-weight:600;white-space:nowrap}
.ro-of .ro-of-ajout-prix s{font-size:12px;font-weight:400;color:var(--ro-doux)}

.ro-of:not([data-style="actuel"]) .kaching-bundles__bars{padding-inline:12px}
.ro-of[data-style="arcade"] .kaching-bundles__bars{padding-inline:12px 16px}
kaching-bundle>.ro-of-choix{margin-inline:12px}

/* Style 1, Actuel : celui du site aujourd'hui */
.ro-of[data-style="actuel"] .kaching-bundles__bars{gap:12px}
.ro-of[data-style="actuel"] .kaching-bundles__bar{background:var(--ro-fond);border:1px solid #cfcdf0}
.ro-of[data-style="actuel"] .kaching-bundles__bar--selected{background:#faf7ff;border:2px solid rgba(81,70,230,.8)}
.ro-of[data-style="actuel"] .ro-of-rond{display:none}
.ro-of[data-style="actuel"] .kaching-bundles__bar-title{font-weight:400;font-size:17px}
.ro-of[data-style="actuel"] .ro-of-badge{position:absolute;top:-7px;right:0;padding:3px 10px;border-radius:0 0 0 8px;background:var(--ro-accent);color:#fff;font-size:12px;font-weight:700}
.ro-of[data-style="actuel"] .ro-of-ajout{background:#fff}

/* Style 2, Nette : des cartes séparées, l'économie dite en une ligne */
.ro-of[data-style="nette"] .kaching-bundles__bar{background:#fff;border:1.5px solid var(--ro-filet);border-radius:14px;transition:border-color .12s}
.ro-of[data-style="nette"] .kaching-bundles__bar--selected{border-color:var(--ro-accent);box-shadow:inset 0 0 0 1px var(--ro-accent);background:var(--ro-teinte)}
.ro-of[data-style="nette"] .kaching-bundles__bar--selected .ro-of-rond{border:7px solid var(--ro-accent)}
.ro-of[data-style="nette"] .ro-of-tete{flex-wrap:wrap}
.ro-of[data-style="nette"] .ro-of-badge{order:9;flex-basis:100%;margin:-4px 0 0 34px;color:var(--ro-vert);font-size:0}
.ro-of[data-style="nette"] .ro-of-badge::after{content:attr(data-phrase);font-size:13px;font-weight:600}
.ro-of[data-style="nette"] .ro-of-ajout{border-top-color:#d7d4f7}

/* Style 3, Cases : les offres côte à côte, chaque ligne à la même hauteur, le détail dessous */
.ro-of[data-style="cases"] .kaching-bundles__bars{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding-top:12px}
.ro-of[data-style="cases"] .kaching-bundles__bar{display:contents}
.ro-of[data-style="cases"] .kaching-bundles__bars>.kaching-bundles__bar:nth-child(n+4):not(.kaching-bundles__bar--selected){display:none}
.ro-of[data-style="cases"] .ro-of-tete{flex-direction:column;align-items:center;gap:4px;min-height:0;padding:10px 4px 10px;background:#fff;border:1.5px solid var(--ro-filet);border-radius:14px;text-align:center}
.ro-of[data-style="cases"] .kaching-bundles__bar--selected>.ro-of-tete{border-color:var(--ro-accent);box-shadow:inset 0 0 0 1px var(--ro-accent);background:var(--ro-teinte)}
.ro-of[data-style="cases"] .kaching-bundles__bar--selected>.ro-of-tete::after{content:"";position:absolute;top:6px;right:6px;width:20px;height:20px;border-radius:50%;background:var(--ro-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E") center/12px no-repeat}
.ro-of[data-style="cases"] .ro-of-tete:has(.ro-of-radio:focus-visible){outline:2px solid var(--ro-accent);outline-offset:2px}
.ro-of[data-style="cases"] .ro-of-rond,.ro-of[data-style="cases"] .ro-of-unite,.ro-of[data-style="cases"] .ro-of-badge{display:none}
.ro-of[data-style="cases"] .ro-of-img{width:64px;height:64px}
.ro-of[data-style="cases"] .ro-of-tete:has(.ro-of-img:empty){padding-top:32px}
.ro-of[data-style="cases"] .ro-of-txt{flex:none;width:100%;align-items:center}
.ro-of[data-style="cases"] .ro-of-titre{display:block;font-size:13px;font-weight:600;line-height:1.25}
.ro-of[data-style="cases"] .ro-of-titre[data-court]{font-size:0}
.ro-of[data-style="cases"] .ro-of-titre[data-court]::after{content:attr(data-court);font-size:clamp(12px,3.4vw,14px);white-space:nowrap}
.ro-of[data-style="cases"] .ro-of-prix{margin-top:auto;align-items:center}
.ro-of[data-style="cases"] .kaching-bundles__bar-price{font-size:18px}
.ro-of[data-style="cases"] .kaching-bundles__bar-full-price{min-height:16px;font-size:12px}
.ro-of[data-style="cases"] .kaching-bundles__bar-full-price:empty{display:block}
.ro-of[data-style="cases"] .ro-of-eco{display:block;min-height:16px;color:var(--ro-vert);font-size:13px;font-weight:600;line-height:1.2;white-space:nowrap}
.ro-of[data-style="cases"] .kaching-bundles__bar--selected>.ro-of-detail{grid-column:1/-1;order:50;border:1.5px solid var(--ro-filet);border-radius:14px;background:#fff;padding-top:10px}
.ro-of[data-style="cases"] .ro-of-ajout:first-child{border-top:0;margin-top:-10px}
.ro-of[data-style="cases"] .ro-of-couleurs{padding:0 8px 10px}
.ro-of[data-style="cases"] .ro-of-pastilles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.ro-of[data-style="cases"] .ro-of-pastilles[data-n="1"]{grid-template-columns:minmax(0,1fr)}
.ro-of[data-style="cases"] .ro-of-pastilles[data-n="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.ro-of[data-style="cases"] .ro-of-pastilles[data-n="4"],.ro-of[data-style="cases"] .ro-of-pastilles[data-n="6"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.ro-of[data-style="cases"] .ro-of-pastille{min-width:0;gap:5px;padding:4px 6px 4px 4px;font-size:13px;line-height:1.15}
.ro-of[data-style="cases"] .ro-of-pastille img{flex:none;width:30px;height:30px}
.ro-of[data-style="cases"] .ro-of-pastille-nom{min-width:0;text-align:left}
@media (max-width:359px){
.ro-of[data-style="cases"] .kaching-bundles__bars{gap:6px;padding-inline:10px}
.ro-of[data-style="cases"] .ro-of-img{width:56px;height:56px}
.ro-of[data-style="cases"] .kaching-bundles__bar-price{font-size:17px}
.ro-of[data-style="cases"] .ro-of-pastille{gap:4px;padding:4px;font-size:12px}
.ro-of[data-style="cases"] .ro-of-pastille img{width:24px;height:24px}
.ro-of[data-style="cases"] .ro-of-pastilles[data-n="3"] .ro-of-pastille{flex-direction:column;justify-content:center;gap:2px}
.ro-of[data-style="cases"] .ro-of-pastilles[data-n="3"] .ro-of-pastille img{width:30px;height:30px}
.ro-of[data-style="cases"] .ro-of-pastilles[data-n="3"] .ro-of-pastille-nom{text-align:center}
}

/* Style 4, Ticket : le chiffre de la quantité d'abord, comme un billet détaché */
.ro-of[data-style="ticket"] .kaching-bundles__bars{gap:10px}
.ro-of[data-style="ticket"] .kaching-bundles__bar{background:#fff;border:1.5px solid var(--ro-filet);border-radius:12px;overflow:hidden}
.ro-of[data-style="ticket"] .kaching-bundles__bar--selected{border-color:var(--ro-accent)}
.ro-of[data-style="ticket"] .ro-of-tete{padding:0 14px 0 0;align-items:stretch}
.ro-of[data-style="ticket"] .ro-of-rond,.ro-of[data-style="ticket"] .ro-of-img{display:none}
.ro-of[data-style="ticket"] .ro-of-num{display:flex;flex:none;align-items:center;justify-content:center;width:60px;font-size:28px;font-weight:800;color:var(--ro-accent);background:var(--ro-teinte);border-right:2px dashed #c5c1f4}
.ro-of[data-style="ticket"] .kaching-bundles__bar--selected .ro-of-num{background:var(--ro-accent);color:#fff;border-right-color:#fff}
.ro-of[data-style="ticket"] .ro-of-txt{justify-content:center;padding:14px 0}
.ro-of[data-style="ticket"] .ro-of-prix{justify-content:center;padding:14px 0}
.ro-of[data-style="ticket"] .ro-of-badge{position:absolute;left:72px;bottom:6px;color:var(--ro-vert);font-size:0}
.ro-of[data-style="ticket"] .ro-of-badge::after{content:attr(data-phrase);font-size:12px;font-weight:600}
.ro-of[data-style="ticket"] .ro-of-tete:has(.ro-of-badge:not([hidden])) .ro-of-txt{padding-bottom:26px}
.ro-of[data-style="ticket"] .ro-of-couleurs{padding-top:12px;border-top:1px solid var(--ro-filet)}

/* Style 5, Arcade : l'univers rétro de la marque, angles nets et ombre dure */
.ro-of[data-style="arcade"] .kaching-bundles__bars{gap:12px}
.ro-of[data-style="arcade"] .kaching-bundles__bar{background:#fff;border:2px solid var(--ro-encre);box-shadow:4px 4px 0 var(--ro-encre)}
.ro-of[data-style="arcade"] .kaching-bundles__bar--selected{background:var(--ro-accent);box-shadow:4px 4px 0 var(--ro-encre)}
.ro-of[data-style="arcade"] .ro-of-rond{display:none}
.ro-of[data-style="arcade"] .ro-of-img{border-radius:0;border:2px solid var(--ro-encre)}
.ro-of[data-style="arcade"] .ro-of-titre{display:block;font-family:"Press Start 2P",monospace;font-size:11px;line-height:1.6;font-weight:400;letter-spacing:0;text-transform:uppercase}
.ro-of[data-style="arcade"] .kaching-bundles__bar--selected>.ro-of-tete .ro-of-titre,.ro-of[data-style="arcade"] .kaching-bundles__bar--selected>.ro-of-tete .kaching-bundles__bar-price,.ro-of[data-style="arcade"] .kaching-bundles__bar--selected>.ro-of-tete .ro-of-unite,.ro-of[data-style="arcade"] .kaching-bundles__bar--selected>.ro-of-tete .kaching-bundles__bar-full-price{color:#fff}
.ro-of[data-style="arcade"] .ro-of-badge{position:absolute;top:-10px;right:8px;padding:3px 6px;background:#ffd400;color:var(--ro-encre);border:2px solid var(--ro-encre);font-size:0;line-height:1}
.ro-of[data-style="arcade"] .ro-of-badge::after{content:attr(data-arcade);font-family:"Press Start 2P",monospace!important;font-size:9px;line-height:1.4}
.ro-of[data-style="arcade"] .ro-of-detail{background:#fff;border-top:2px solid var(--ro-encre);padding-top:12px}
.ro-of[data-style="arcade"] .ro-of-ajout:first-child{margin-top:-12px;border-top:0}
.ro-of[data-style="arcade"] .ro-of-pastille{border-radius:0;border:2px solid var(--ro-filet);padding:3px 8px 3px 3px;gap:4px}
.ro-of[data-style="arcade"] .ro-of-couleurs{padding-inline:10px}
.ro-of[data-style="arcade"] .ro-of-pastille.on{border-color:var(--ro-encre);box-shadow:2px 2px 0 var(--ro-encre)}
.ro-of[data-style="arcade"] .ro-of-pastille img{border-radius:0}

/* Choix du style : visible seulement avec ?styles=1 */
.ro-of-choix{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 12px;padding:4px;border-radius:12px;background:#14162b;color:#fff}
.ro-of-choix-nom{flex:1;text-align:center;font-size:14px;font-weight:600}
.ro-of-choix-fl{width:44px;height:44px;border:0;border-radius:10px;background:rgba(255,255,255,.12);color:#fff;font-size:22px;line-height:1;cursor:pointer}
@media (prefers-reduced-motion:reduce){.ro-of *{transition:none!important}}
@media (hover:hover) and (pointer:fine){.ro-of .kaching-bundles__bar:not(.kaching-bundles__bar--selected) .ro-of-tete:hover{background:rgba(81,70,230,.05)}}
