/* ==========================================================================
   VITRINE INTELLIGENTE — sections automatiques de la boutique + menu bas mobile
   (charte Bélier Shopping : bleu nuit, orange, bordeaux — voir style.css)
   ========================================================================== */

/* ---------- Apparition au défilement ---------- */
.bv-reveal{opacity:0;transform:translateY(28px) scale(.985);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);}
.bv-reveal.is-in{opacity:1;transform:none;}
.bv-reveal .bv-card{opacity:0;transform:translateY(22px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease;transition-delay:calc(var(--i,0) * 70ms + 120ms);}
.bv-reveal.is-in .bv-card{opacity:1;transform:none;}
.bv-reveal.is-in .bv-card:hover{transform:translateY(-6px);transition-delay:0s;}

/* ---------- Section ---------- */
.bv-section{position:relative;margin:34px 0 8px;}
.bv-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:14px;}
.bv-head-l{display:flex;align-items:center;gap:12px;min-width:0;}
.bv-ico{flex:none;width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:21px;background:var(--gradient-navy);color:#fff;box-shadow:0 8px 20px rgba(11,37,89,.28);position:relative;overflow:hidden;}
.bv-ico::after{content:'';position:absolute;inset:-40%;background:linear-gradient(120deg,transparent 40%,rgba(255,255,255,.45) 50%,transparent 60%);animation:bvShine 3.6s ease-in-out infinite;}
.bv-ico.gold{background:var(--gradient-gold);box-shadow:0 8px 20px rgba(245,129,10,.35);}
.bv-ico.red{background:var(--gradient-burgundy);box-shadow:0 8px 20px rgba(198,48,62,.35);}
.bv-title{font-family:var(--serif);font-size:21px;letter-spacing:.06em;text-transform:uppercase;line-height:1.1;margin:0;color:var(--ink);}
.bv-title::after{content:'';display:block;height:3px;width:46px;margin-top:7px;border-radius:3px;background:var(--gradient-gold);transform-origin:left;transform:scaleX(0);transition:transform .9s cubic-bezier(.2,.8,.2,1) .25s;}
.bv-reveal.is-in .bv-title::after{transform:scaleX(1);}
.bv-sub{font-size:12.5px;color:var(--slate);margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bv-head-r{display:flex;align-items:center;gap:8px;flex:none;}
.bv-all{font-size:13px;font-weight:700;color:var(--gold);padding:7px 12px;border-radius:20px;transition:background .2s ease;white-space:nowrap;}
.bv-all:hover{background:rgba(245,129,10,.1);}
.bv-arrow{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:16px;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 10px rgba(16,24,38,.07);transition:all .2s ease;}
.bv-arrow:hover{background:var(--ink-soft);color:#fff;border-color:var(--ink-soft);transform:scale(1.06);}
.bv-arrow:disabled{opacity:.35;cursor:default;transform:none;background:#fff;color:var(--ink);border-color:var(--line);}

/* ---------- Bande défilante ---------- */
.bv-rail-wrap{position:relative;}
.bv-rail{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 5 * 16px) / 6);gap:16px;overflow-x:auto;overflow-y:visible;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:6px 2px 18px;overscroll-behavior-x:contain;cursor:grab;}
.bv-rail::-webkit-scrollbar{display:none;}
.bv-rail.dragging{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto;}
.bv-rail.dragging .bv-card{pointer-events:none;}
.bv-rail > *{scroll-snap-align:start;}
.bv-rail-wrap::before,.bv-rail-wrap::after{content:'';position:absolute;top:0;bottom:14px;width:28px;z-index:2;pointer-events:none;opacity:0;transition:opacity .3s ease;}
.bv-rail-wrap::before{left:0;background:linear-gradient(90deg,var(--bone),transparent);}
.bv-rail-wrap::after{right:0;background:linear-gradient(-90deg,var(--bone),transparent);}
.bv-rail-wrap.can-l::before,.bv-rail-wrap.can-r::after{opacity:1;}
.bv-progress{height:3px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:-8px;max-width:160px;}
.bv-progress i{display:block;height:100%;width:20%;background:var(--gradient-gold);border-radius:3px;transition:transform .2s linear;}

/* ---------- Carte article ---------- */
.bv-card{position:relative;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 4px 16px rgba(16,24,38,.06);color:var(--ink);min-width:0;}
.bv-card:hover{box-shadow:0 18px 38px rgba(11,37,89,.16);border-color:rgba(245,129,10,.45);}
.bv-media{position:relative;aspect-ratio:1/1;overflow:hidden;background:linear-gradient(135deg,#eef2fa,#e1e8f7);}
.bv-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .4s ease;opacity:0;}
.bv-media img.ok{opacity:1;}
.bv-card:hover .bv-media img{transform:scale(1.08);}
.bv-media::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(5,14,36,.42));opacity:.0;transition:opacity .35s ease;pointer-events:none;}
.bv-card:hover .bv-media::after{opacity:1;}
.bv-badges{position:absolute;top:9px;left:9px;display:flex;flex-direction:column;gap:5px;z-index:2;align-items:flex-start;}
.bv-chip{display:inline-flex;align-items:center;gap:4px;padding:4px 9px;border-radius:20px;font-size:10.5px;font-weight:800;letter-spacing:.03em;color:#fff;background:var(--gradient-burgundy);box-shadow:0 4px 12px rgba(198,48,62,.35);}
.bv-chip.gold{background:var(--gradient-gold);color:var(--ink);box-shadow:0 4px 12px rgba(245,129,10,.35);}
.bv-chip.navy{background:var(--gradient-navy);}
.bv-chip.glass{background:rgba(255,255,255,.88);color:var(--ink);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 3px 10px rgba(0,0,0,.12);}
.bv-fav{position:absolute;top:8px;right:8px;z-index:3;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.92);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,.14);transition:transform .2s ease;color:var(--slate);}
.bv-fav svg{width:18px;height:18px;}
.bv-fav:hover{transform:scale(1.1);}
.bv-fav.on{color:var(--burgundy);}
.bv-fav.on svg path{fill:currentColor;}
.bv-fav.pop{animation:bvPop .45s cubic-bezier(.2,1.6,.4,1);}
.bv-rank{position:absolute;left:6px;bottom:-14px;z-index:2;font-family:var(--serif);font-weight:700;font-size:64px;line-height:1;color:#fff;-webkit-text-stroke:2px var(--gold);text-shadow:0 6px 18px rgba(5,14,36,.45);pointer-events:none;}
.bv-cd{position:absolute;left:8px;right:8px;bottom:8px;z-index:2;display:flex;align-items:center;justify-content:center;gap:6px;padding:6px 8px;border-radius:10px;background:rgba(5,14,36,.78);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#fff;font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.02em;}
.bv-cd b{color:var(--gold-light);}
.bv-body{padding:11px 13px 13px;display:flex;flex-direction:column;gap:3px;flex:1;}
.bv-reason{font-size:10.5px;font-weight:700;color:var(--blue);letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bv-name{font-size:13.5px;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:35px;}
.bv-price{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;margin-top:3px;}
.bv-price b{font-family:var(--serif);font-size:16.5px;color:var(--gold);}
.bv-price s{font-size:11.5px;color:var(--slate);}
.bv-meta{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--slate);margin-top:2px;white-space:nowrap;overflow:hidden;}
.bv-meta .st{color:#E5A100;}
.bv-stock{margin-top:6px;}
.bv-stock .bar{height:5px;border-radius:5px;background:var(--burgundy-light);overflow:hidden;}
.bv-stock .bar i{display:block;height:100%;background:var(--gradient-burgundy);border-radius:5px;transform-origin:left;animation:bvGrow 1.2s cubic-bezier(.2,.8,.2,1) both;}
.bv-stock small{display:block;font-size:10.5px;color:var(--burgundy);font-weight:700;margin-top:3px;}

/* ---------- Section Flash : panneau premium animé ---------- */
.bv-flash{padding:20px 20px 10px;border-radius:24px;background:var(--gradient-dark);color:#fff;overflow:hidden;box-shadow:0 22px 50px rgba(5,14,36,.35);isolation:isolate;}
.bv-flash::before{content:'';position:absolute;inset:-2px;border-radius:26px;padding:2px;background:conic-gradient(from var(--bv-ang,0deg),#F5810A,#C6303E,#FFA23C,#1D4ED8,#F5810A);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:bvSpin 6s linear infinite;z-index:-1;opacity:.9;}
.bv-flash::after{content:'';position:absolute;width:420px;height:420px;right:-120px;top:-180px;border-radius:50%;background:radial-gradient(circle,rgba(245,129,10,.35),transparent 65%);z-index:-1;animation:bvFloat 7s ease-in-out infinite;}
.bv-flash .bv-title{color:#fff;}
.bv-flash .bv-sub{color:#C9D3EA;}
.bv-flash .bv-arrow{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22);color:#fff;}
.bv-flash .bv-arrow:hover{background:var(--gradient-gold);color:var(--ink);}
.bv-flash .bv-all{color:var(--gold-light);}
.bv-flash .bv-rail-wrap::before{background:linear-gradient(90deg,rgba(11,37,89,.95),transparent);}
.bv-flash .bv-rail-wrap::after{background:linear-gradient(-90deg,rgba(11,37,89,.95),transparent);}
.bv-flash .bv-card{border-color:rgba(255,255,255,.08);}
.bv-flash .bv-progress{background:rgba(255,255,255,.15);}
.bv-flash .bv-ico{animation:bvZap 1.8s ease-in-out infinite;}
.bv-flash-clock{display:flex;align-items:center;gap:6px;font-size:11px;color:#C9D3EA;}
.bv-flash-clock span{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;min-width:38px;padding:5px 4px;border-radius:9px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);font-family:var(--serif);font-size:17px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums;line-height:1;}
.bv-flash-clock span small{font-family:var(--sans);font-size:8.5px;letter-spacing:.1em;color:var(--gold-light);margin-top:3px;font-weight:700;}
.bv-card.bv-expired{animation:bvOut .6s ease forwards;}

/* ---------- Trending : cartes plus larges et numérotées ---------- */
.bv-section.trending .bv-rail{grid-auto-columns:calc((100% - 4 * 16px) / 5);}
.bv-section.trending .bv-media{aspect-ratio:4/5;}
.bv-section.trending .bv-body{padding-top:18px;}

/* ---------- Squelettes de chargement ---------- */
.bv-skel{border-radius:18px;background:#fff;border:1px solid var(--line);overflow:hidden;}
.bv-skel i{display:block;background:linear-gradient(90deg,#e9eef8 0%,#f6f8fc 45%,#e9eef8 90%);background-size:220% 100%;animation:bvShimmer 1.3s linear infinite;}
.bv-skel i.m{aspect-ratio:1/1;}
.bv-skel i.l{height:11px;margin:12px 12px 0;border-radius:6px;}
.bv-skel i.l.s{width:55%;margin-bottom:14px;}
.bv-skel-title{height:22px;width:240px;max-width:60%;border-radius:8px;margin:34px 0 16px;background:linear-gradient(90deg,#e1e8f7 0%,#f3f6fc 45%,#e1e8f7 90%);background-size:220% 100%;animation:bvShimmer 1.3s linear infinite;}

/* ---------- Page « Voir tout » d'une section ---------- */
.bv-page-hero{position:relative;border-radius:22px;padding:26px 24px;margin:16px 0 22px;color:#fff;background:var(--gradient-dark);overflow:hidden;box-shadow:0 18px 40px rgba(5,14,36,.25);}
.bv-page-hero::after{content:'';position:absolute;right:-80px;top:-120px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(245,129,10,.4),transparent 65%);animation:bvFloat 7s ease-in-out infinite;}
.bv-page-hero h2{font-size:26px;letter-spacing:.06em;text-transform:uppercase;position:relative;z-index:1;}
.bv-page-hero p{color:#C9D3EA;font-size:13px;margin:8px 0 0;position:relative;z-index:1;}
.bv-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
.bv-grid .bv-card{opacity:0;animation:bvIn .6s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(var(--i,0) * 45ms);}
.bv-grid .bv-card:hover{transform:translateY(-5px);}

/* ---------- Page Catégories (style application mobile) ---------- */
.bv-cats{display:grid;grid-template-columns:150px 1fr;gap:0;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;min-height:calc(100vh - 240px);box-shadow:0 6px 22px rgba(16,24,38,.06);}
.bv-cats-rail{background:#F4F6FB;overflow-y:auto;border-right:1px solid var(--line);}
.bv-cats-rail button{display:block;width:100%;text-align:left;padding:16px 14px;font-size:13px;line-height:1.3;color:var(--ink-soft);background:transparent;border-left:3px solid transparent;border-bottom:1px solid var(--line);transition:all .2s ease;}
.bv-cats-rail button.on{background:#fff;color:var(--gold);font-weight:700;border-left-color:var(--gold);}
.bv-cats-panel{padding:16px;overflow:hidden;}
.bv-cats-block{border:1px solid var(--line);border-radius:14px;margin-bottom:14px;background:#fff;animation:bvIn .5s ease both;}
.bv-cats-block-h{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-bottom:1px solid var(--line);font-size:14px;font-weight:600;}
.bv-cats-block-h a{color:var(--gold);font-weight:700;font-size:13px;}
.bv-cats-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px;padding:14px;}
.bv-tile{text-align:center;font-size:11.5px;color:var(--ink-soft);line-height:1.25;cursor:pointer;opacity:0;animation:bvIn .5s ease forwards;animation-delay:calc(var(--i,0) * 40ms);}
.bv-tile div{aspect-ratio:1/1;border-radius:12px;overflow:hidden;background:#F1F4FA;margin-bottom:6px;}
.bv-tile img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease;}
.bv-tile:hover img{transform:scale(1.07);}
.bv-tile span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* ---------- Menu bas (mobile & tablette) ---------- */
.bv-bnav{display:none;}
@media (max-width:900px){
  body.bv-has-nav{padding-bottom:calc(92px + env(safe-area-inset-bottom));}
  body.bv-has-nav .topbar .nav-links{display:none!important;}
  body.bv-has-nav .toast-wrap{bottom:calc(98px + env(safe-area-inset-bottom));right:12px;left:12px;align-items:center;}
  body.bv-has-nav .install-banner{bottom:calc(96px + env(safe-area-inset-bottom));}
  body.bv-has-nav .net-status{bottom:calc(94px + env(safe-area-inset-bottom));}
  .bv-bnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:240;height:70px;padding:0 4px;border-radius:24px;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.6) blur(16px);-webkit-backdrop-filter:saturate(1.6) blur(16px);border:1px solid rgba(220,227,242,.9);box-shadow:0 18px 40px rgba(11,37,89,.22),0 2px 6px rgba(11,37,89,.08);animation:bvNavIn .6s cubic-bezier(.2,.9,.25,1.2) both;}
  .bv-bnav::before{content:'';position:absolute;top:0;left:22px;right:22px;height:2px;border-radius:2px;background:var(--gradient-gold);opacity:.55;}
  .bv-bnav a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:#5B6680;font-size:10.5px;font-weight:600;letter-spacing:.01em;-webkit-tap-highlight-color:transparent;transition:color .25s ease;}
  .bv-bnav a .ic{position:relative;width:46px;height:32px;border-radius:16px;display:flex;align-items:center;justify-content:center;transition:background .35s ease,transform .35s cubic-bezier(.2,1.4,.4,1);}
  .bv-bnav a svg{width:23px;height:23px;transition:transform .35s cubic-bezier(.2,1.4,.4,1);}
  .bv-bnav a.on{color:var(--gold);}
  .bv-bnav a.on .ic{background:linear-gradient(135deg,rgba(255,162,60,.22),rgba(245,129,10,.14));transform:translateY(-2px);}
  .bv-bnav a.on svg{transform:scale(1.08);}
  .bv-bnav a.on::after{content:'';position:absolute;bottom:6px;width:5px;height:5px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(245,129,10,.18);animation:bvPop .4s ease;}
  .bv-bnav a:active .ic{transform:scale(.9);}
  .bv-bnav .bdg{position:absolute;top:-3px;right:3px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--gradient-burgundy);color:#fff;font-size:10px;font-weight:800;display:none;align-items:center;justify-content:center;border:2px solid #fff;}
  .bv-bnav .bdg.show{display:flex;animation:bvPop .45s cubic-bezier(.2,1.6,.4,1);}
  .bv-bnav .ink{position:absolute;inset:auto;width:10px;height:10px;border-radius:50%;background:rgba(245,129,10,.25);transform:scale(0);animation:bvInk .55s ease-out forwards;pointer-events:none;}
}

/* ---------- Invitation aux notifications (visiteurs) ---------- */
.bv-notif{position:fixed;left:14px;right:14px;bottom:calc(16px + env(safe-area-inset-bottom));max-width:430px;margin:0 auto;z-index:260;display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:18px;background:var(--gradient-dark);color:#fff;box-shadow:0 20px 44px rgba(5,14,36,.4);border:1px solid rgba(245,129,10,.35);animation:bvUp .55s cubic-bezier(.2,.9,.25,1.2) both;}
.bv-notif .bell{flex:none;width:42px;height:42px;border-radius:13px;background:var(--gradient-gold);display:flex;align-items:center;justify-content:center;font-size:20px;animation:bvRing 2.4s ease-in-out infinite;}
.bv-notif b{font-size:14px;}
.bv-notif p{margin:2px 0 0;font-size:12px;color:#C9D3EA;line-height:1.4;}
.bv-notif .x{background:transparent;color:#C9D3EA;font-size:16px;padding:4px;}
@media (max-width:900px){ body.bv-has-nav .bv-notif{bottom:calc(96px + env(safe-area-inset-bottom));} }

/* ---------- Bouton favori sur la fiche article ---------- */
.bv-fav-btn{display:inline-flex;align-items:center;gap:7px;padding:10px 16px;border-radius:30px;border:1.5px solid var(--line);background:#fff;font-size:13px;font-weight:600;color:var(--ink-soft);transition:all .2s ease;}
.bv-fav-btn svg{width:17px;height:17px;}
.bv-fav-btn.on{border-color:var(--burgundy);color:var(--burgundy);background:var(--burgundy-light);}
.bv-fav-btn.on svg path{fill:currentColor;}

/* ---------- Responsive ---------- */
@media (max-width:1180px){
  .bv-rail{grid-auto-columns:calc((100% - 4 * 16px) / 5);}
  .bv-section.trending .bv-rail{grid-auto-columns:calc((100% - 3 * 16px) / 4);}
  .bv-grid{grid-template-columns:repeat(4,1fr);}
}
@media (max-width:900px){
  .bv-rail{grid-auto-columns:30%;gap:13px;}
  .bv-section.trending .bv-rail{grid-auto-columns:38%;}
  .bv-arrow{display:none;}
  .bv-grid{grid-template-columns:repeat(3,1fr);gap:13px;}
  .bv-title{font-size:18px;}
  .bv-cats{grid-template-columns:118px 1fr;min-height:calc(100vh - 210px);}
}
@media (max-width:600px){
  .bv-section{margin-top:26px;}
  .bv-rail{grid-auto-columns:44%;gap:11px;padding-bottom:16px;}
  .bv-section.trending .bv-rail{grid-auto-columns:62%;}
  .bv-grid{grid-template-columns:repeat(2,1fr);gap:11px;}
  .bv-title{font-size:16px;letter-spacing:.04em;}
  .bv-sub{font-size:11.5px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
  .bv-ico{width:38px;height:38px;border-radius:12px;font-size:18px;}
  .bv-flash{padding:16px 14px 8px;border-radius:20px;margin-left:-6px;margin-right:-6px;}
  .bv-flash-clock span{min-width:32px;font-size:15px;}
  .bv-flash-clock em{display:none;}
  .bv-head{align-items:flex-start;flex-wrap:wrap;}
  .bv-rank{font-size:52px;}
  .bv-name{font-size:12.5px;min-height:32px;}
  .bv-price b{font-size:15px;}
  .bv-cats{grid-template-columns:100px 1fr;border-radius:14px;}
  .bv-cats-rail button{padding:14px 9px;font-size:12px;}
  .bv-cats-panel{padding:10px;}
  .bv-cats-tiles{grid-template-columns:repeat(3,1fr);gap:9px;padding:10px;}
  .bv-page-hero{padding:20px 18px;}
  .bv-page-hero h2{font-size:20px;}
}
@media (max-width:360px){ .bv-rail{grid-auto-columns:56%;} .bv-bnav a{font-size:9.5px;} }

/* ---------- Animations ---------- */
@property --bv-ang{syntax:'<angle>';inherits:false;initial-value:0deg;}
@keyframes bvSpin{to{--bv-ang:360deg;}}
@keyframes bvShine{0%,60%{transform:translateX(-60%);}100%{transform:translateX(60%);}}
@keyframes bvShimmer{to{background-position:-220% 0;}}
@keyframes bvFloat{0%,100%{transform:translate(0,0);}50%{transform:translate(-30px,24px);}}
@keyframes bvZap{0%,100%{transform:rotate(0) scale(1);}10%{transform:rotate(-12deg) scale(1.08);}20%{transform:rotate(10deg) scale(1.08);}30%{transform:rotate(0) scale(1);}}
@keyframes bvPop{0%{transform:scale(.4);}60%{transform:scale(1.25);}100%{transform:scale(1);}}
@keyframes bvGrow{from{transform:scaleX(0);}}
@keyframes bvIn{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
@keyframes bvOut{to{opacity:0;transform:scale(.85);filter:grayscale(1);}}
@keyframes bvUp{from{opacity:0;transform:translateY(40px);}to{opacity:1;transform:none;}}
@keyframes bvNavIn{from{opacity:0;transform:translateY(110%);}to{opacity:1;transform:none;}}
@keyframes bvRing{0%,70%,100%{transform:rotate(0);}75%{transform:rotate(14deg);}80%{transform:rotate(-12deg);}85%{transform:rotate(8deg);}90%{transform:rotate(-5deg);}}
@keyframes bvInk{to{transform:scale(9);opacity:0;}}
@media (prefers-reduced-motion: reduce){
  .bv-reveal,.bv-reveal .bv-card,.bv-grid .bv-card,.bv-tile,.bv-cats-block{opacity:1!important;transform:none!important;animation:none!important;transition:none!important;}
  .bv-flash::before,.bv-flash::after,.bv-ico::after,.bv-flash .bv-ico,.bv-notif .bell,.bv-bnav{animation:none!important;}
}

/* ================================================================== */
/* V7.1 — Corrections d'affichage (barre du haut, Mon compte, statut   */
/* « En ligne ») + motifs d'arrière-plan légèrement animés.            */
/* ================================================================== */

/* ---------- Statut « En ligne » : bulle flottante, apparaît puis disparaît complètement ---------- */
.net-status{opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,24px);
  transition:transform .45s cubic-bezier(.2,.9,.25,1.2),opacity .35s ease,visibility 0s linear .45s;}
.net-status.show{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);
  transition:transform .45s cubic-bezier(.2,.9,.25,1.2),opacity .3s ease,visibility 0s;}
@media (max-width:900px){
  body.bv-has-nav .net-status{bottom:calc(92px + env(safe-area-inset-bottom));padding:7px 14px;font-size:12px;box-shadow:0 10px 26px rgba(5,14,36,.3);}
}

/* ---------- Barre du haut (ordinateur) : rubriques alignées ---------- */
.topbar .nav-links{display:flex;align-items:center;gap:4px;flex-wrap:nowrap;white-space:nowrap;}
.topbar .tb-link{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:22px;color:#EEF2FA;font-size:13px;font-weight:600;letter-spacing:.01em;transition:background .2s ease,color .2s ease;}
.topbar .tb-link svg{width:17px;height:17px;color:var(--gold-light);flex:none;}
.topbar .tb-link:hover{background:rgba(238,242,250,.1);color:#fff;}
.topbar .cart-btn{width:40px;height:40px;margin:0 4px 0 6px;transition:background .2s ease,transform .2s ease;}
.topbar .cart-btn svg{width:19px;height:19px;}
.topbar .cart-btn:hover{background:rgba(245,129,10,.18);transform:translateY(-1px);}
.topbar .tb-sep{width:1px;height:24px;background:rgba(238,242,250,.2);margin:0 10px;flex:none;}
.topbar .tb-logout,.topbar .tb-login{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 18px;}
.topbar .tb-logout svg,.topbar .tb-login svg{width:16px;height:16px;flex:none;}
.topbar .tb-logout{background:transparent;color:#EEF2FA;border:1px solid rgba(238,242,250,.28);box-shadow:none;}
.topbar .tb-logout:hover{background:rgba(198,48,62,.22);border-color:rgba(219,74,87,.7);color:#fff;}
@media (min-width:901px) and (max-width:1180px){
  .topbar .tb-link span,.topbar .tb-logout span{display:none;}
  .topbar .tb-link{width:40px;padding:0;justify-content:center;}
  .topbar .tb-logout{width:40px;padding:0;justify-content:center;}
}

/* ---------- Barre du haut (mobile & tablette) : une seule ligne propre ---------- */
@media (max-width:900px){
  body.bv-has-nav .topbar{flex-wrap:nowrap;padding:10px 14px;gap:8px;}
  body.bv-has-nav .topbar .brand{flex:1;min-width:0;justify-content:center;}
  body.bv-has-nav .topbar .brand > span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  body.bv-has-nav .topbar > div:last-child{gap:0!important;flex:none;}
  body.bv-has-nav .topbar .sync span:last-child{display:none;}
  body.bv-has-nav .topbar .sync{padding:8px;}
  body.bv-has-nav .nav-actions{margin-right:0;gap:6px;}
}
@media (max-width:600px){
  body.bv-has-nav .nav-actions button.nav-home{width:36px;padding:0;font-size:0;}
  body.bv-has-nav .nav-actions button.nav-home::before{content:'🏠';font-size:15px;}
  body.bv-has-nav .topbar .brand{font-size:16px;gap:8px;}
  body.bv-has-nav .topbar .brand-logo{width:30px;height:30px;}
}

/* ---------- Mon compte ---------- */
.acc-page{padding-top:26px;}
.acc-hero{position:relative;overflow:hidden;display:flex;align-items:center;gap:18px;padding:22px 26px;border-radius:22px;margin-bottom:22px;
  background:var(--gradient-dark);color:#fff;box-shadow:0 18px 40px rgba(11,37,89,.22);animation:bvUp .55s cubic-bezier(.2,.9,.25,1.2) both;}
.acc-hero::after{content:'';position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(245,129,10,.35),transparent 65%);pointer-events:none;}
.acc-avatar{flex:none;width:62px;height:62px;border-radius:20px;background:var(--gradient-gold);color:var(--ink);display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-size:24px;letter-spacing:.04em;box-shadow:0 8px 20px rgba(245,129,10,.4);}
.acc-id{min-width:0;position:relative;z-index:1;}
.acc-id .eyebrow{color:var(--gold-light);}
.acc-id h2{font-size:24px;margin:4px 0 6px;color:#fff;overflow:hidden;text-overflow:ellipsis;}
.acc-meta{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:#C9D3EA;}
.acc-meta span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;}

.acc-page .account-layout{grid-template-columns:260px 1fr;gap:26px;}
.acc-page .account-sidebar{display:block;padding:10px;border-radius:18px;box-shadow:0 8px 26px rgba(11,37,89,.07);top:96px;}
.acc-page .account-sidebar a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;font-size:14px;color:var(--ink);transition:background .2s ease,color .2s ease;}
.acc-page .account-sidebar a i{flex:none;width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--bone);color:var(--slate);transition:background .2s ease,color .2s ease;}
.acc-page .account-sidebar a i svg{width:18px;height:18px;}
.acc-page .account-sidebar a:hover{background:var(--bone);}
.acc-page .acc-tab.active{background:linear-gradient(135deg,rgba(255,162,60,.16),rgba(245,129,10,.08));color:var(--gold);font-weight:700;}
.acc-page .acc-tab.active i{background:var(--gradient-gold);color:var(--ink);box-shadow:0 4px 12px rgba(245,129,10,.35);}
.acc-page .acc-tab .sm{display:none;}
.acc-page .acc-act span{flex:1;}
.acc-page .acc-act b{display:none;}
.acc-page .acc-act.danger{color:var(--burgundy);}
.acc-page .acc-act.danger i{background:var(--burgundy-light);color:var(--burgundy);}
.acc-page .account-sep{margin:8px 10px;}
.acc-page #accountContent{min-width:0;animation:bvIn .45s ease both;}

@media (max-width:900px){
  .acc-page{padding-top:16px;}
  .acc-hero{padding:18px;gap:14px;border-radius:20px;margin-bottom:16px;}
  .acc-avatar{width:54px;height:54px;border-radius:17px;font-size:21px;}
  .acc-id h2{font-size:20px;white-space:nowrap;}
  .acc-meta{font-size:12px;gap:2px 12px;}
  .acc-page .account-layout{display:flex;flex-direction:column;align-items:stretch;gap:16px;}
  .acc-page .account-sidebar{display:contents;}
  .acc-page .account-sep{display:none;}
  /* Rubriques principales : contrôle segmenté en 3 colonnes égales */
  .acc-page .acc-tabs{order:1;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:0 8px 24px rgba(11,37,89,.07);}
  .acc-page .acc-tabs .acc-tab{flex-direction:column;justify-content:center;gap:6px;padding:10px 4px;border-radius:13px;font-size:12px;font-weight:600;text-align:center;color:var(--slate);}
  .acc-page .acc-tabs .acc-tab i{width:36px;height:36px;border-radius:12px;}
  .acc-page .acc-tab .lg{display:none;}
  .acc-page .acc-tab .sm{display:block;}
  .acc-page .acc-tab.active{color:var(--gold);}
  .acc-page #accountContent{order:2;}
  /* Actions secondaires : liste de réglages en bas de page */
  .acc-page .acc-actions{order:3;background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 8px 24px rgba(11,37,89,.06);}
  .acc-page .acc-actions .acc-act{border-radius:0;padding:13px 14px;border-bottom:1px solid var(--line);}
  .acc-page .acc-actions .acc-act:last-child{border-bottom:none;}
  .acc-page .acc-act b{display:flex;color:#A3ADC2;}
  .acc-page .acc-act b svg{width:16px;height:16px;}
}

/* ---------- Motifs d'arrière-plan légèrement animés ---------- */
/* Le motif (bélier, sac, cadenas, repère, coche) glisse très lentement en diagonale et les halos
   de couleur « respirent » : animé uniquement par transformations (fluide, sans surcharge mobile). */
body{background-image:none;}
body::before,body::after{content:'';position:fixed;pointer-events:none;z-index:-1;}
body::before{inset:-220px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke='%231D4ED8' stroke-width='1.4' opacity='0.08'%3E%3Cpath d='M40 70c-13 0-19-10-19-20 0-7 3.5-11 8.5-11 3.5 0 5.6 2.8 5.6 6.3 0-6.3-4.2-10.5-9.8-10.5-6.3 0-11.2 5.6-11.2 13.3 0 14 10.5 24.5 26 24.5s26-10.5 26-24.5c0-7.7-4.9-13.3-11.2-13.3-5.6 0-9.8 4.2-9.8 10.5 0-3.5 2.1-6.3 5.6-6.3 5 0 8.5 4 8.5 11 0 10-6 20-19 20z'/%3E%3Ccircle cx='170' cy='40' r='13'/%3E%3Cpath d='M158 40h24M170 28v24'/%3E%3Cpath d='M120 150l14 14 26-30' /%3E%3Crect x='30' y='150' width='36' height='28' rx='3'/%3E%3Cpath d='M30 158h36M42 150v-8a6 6 0 0 1 12 0v8'/%3E%3Cpath d='M190 130c0 12-9 20-9 20s-9-8-9-20a9 9 0 0 1 18 0z'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:repeat;background-size:220px 220px;will-change:transform;animation:bvBgDrift 70s linear infinite;}
body::after{inset:0;
  background-image:
    radial-gradient(circle at 8% 8%, rgba(29,78,216,.09) 0%, transparent 40%),
    radial-gradient(circle at 92% 18%, rgba(245,129,10,.09) 0%, transparent 42%),
    radial-gradient(circle at 50% 92%, rgba(29,78,216,.08) 0%, transparent 45%);
  will-change:transform,opacity;animation:bvBgBreath 14s ease-in-out infinite alternate;}
@keyframes bvBgDrift{from{transform:translate3d(0,0,0);}to{transform:translate3d(220px,220px,0);}}
@keyframes bvBgBreath{0%{opacity:.75;transform:scale(1);}100%{opacity:1;transform:scale(1.06);}}
@media (prefers-reduced-motion: reduce){ body::before,body::after{animation:none;} }
@media print{ body::before,body::after{display:none;} }
