/* =========================================================================
   VooX — MultiniveauX, le réseau de vente d'une marque. S'ajoute au Store
   (voox-marketplace.css) et au Store Pro (voox-store-pro.css).
   ========================================================================= */
.vx-tete{display:flex;align-items:center;gap:18px;margin-top:6px}
.vx-tete h1{margin:8px 0 10px}
.vx-logo{flex:0 0 76px;height:76px;border-radius:20px;overflow:hidden;background:#fff;display:flex;align-items:center;justify-content:center;font:700 30px/1 var(--voox-font-title,'Oxanium',sans-serif);color:var(--voox-title,#0B0F14)}
.vx-logo img{width:100%;height:100%;object-fit:cover}

.vx-moi{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin:26px 0 0;padding:26px 28px;border-radius:20px;background:#FFF0F7;border:1px solid #FFD3EA}
.vx-moi > div{flex:1 1 380px;min-width:0}
.vx-moi h2{margin:6px 0 8px;font:700 22px/1.25 var(--voox-font-title,'Oxanium',sans-serif)}
.vx-moi p{margin:0;color:var(--voox-text,#46536A)}
.vx-lien{display:flex;gap:8px;margin-top:12px;max-width:620px}
.vx-lien input{flex:1;min-width:0;padding:11px 14px;border:1px solid var(--voox-line,rgba(11,15,20,.16));border-radius:999px;background:#fff;font:500 14px/1.2 var(--voox-font-text,'Inter',sans-serif);color:var(--voox-title,#0B0F14)}
.vx-code{margin-top:8px!important;font-size:13.5px}
.vx-bilan{display:flex;gap:12px;flex-wrap:wrap;margin:0}
.vx-bilan div{min-width:130px;padding:14px 16px;border-radius:14px;background:#fff}
.vx-bilan dt{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--voox-text,#46536A)}
.vx-bilan dd{margin:4px 0 0;font:700 22px/1.1 var(--voox-font-title,'Oxanium',sans-serif);color:var(--voox-title,#0B0F14)}

.vx-etapes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.vx-etapes li{padding:18px;border-radius:16px;background:var(--voox-soft,#F2F5F9);font-size:14px;line-height:1.5;color:var(--voox-text,#46536A)}
.vx-etapes span{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--voox-title,#0B0F14);color:#fff;font-weight:700;margin-bottom:10px}
.vx-etapes strong{display:block;font-size:16px;color:var(--voox-title,#0B0F14);margin-bottom:4px}

.vx-niveaux{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
.vx-niveau{display:flex;flex-direction:column;gap:4px;padding:20px;border-radius:18px;background:var(--voox-dark-gradient,linear-gradient(90deg,#000 0%,#161B22 100%));color:rgba(255,255,255,.75);font-size:13.5px}
.vx-niveau strong{font:700 34px/1.1 var(--voox-font-title,'Oxanium',sans-serif);color:#fff}
.vx-niveau.est-vide strong{font-size:22px;color:rgba(255,255,255,.6)}
.vx-niveau-n{font:700 12px/1 var(--voox-font-text,'Inter',sans-serif);letter-spacing:.1em;text-transform:uppercase;color:var(--voox-rose-soft,#FF7ABC)}
.vx-note{margin:12px 0 0;font-size:13.5px;color:var(--voox-text,#46536A)}

.vx-classement{margin:0;padding:0;list-style:none;border:1px solid var(--voox-line,rgba(11,15,20,.12));border-radius:16px;overflow:hidden}
.vx-classement li{display:flex;align-items:center;gap:14px;padding:12px 18px;border-top:1px solid var(--voox-line,rgba(11,15,20,.08));background:#fff}
.vx-classement li:first-child{border-top:0}
.vx-classement li.est-moi{background:#FFF7FB}
.vx-rang{width:26px;font:700 16px/1 var(--voox-font-title,'Oxanium',sans-serif);color:var(--voox-text,#46536A)}
.vx-classement li:nth-child(-n+3) .vx-rang{color:var(--voox-brand-ink,#B8286E)}
.vx-avatar{flex:0 0 40px;height:40px;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,#FFE3F1 0%,#E6E1FF 100%);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--voox-brand-ink,#B8286E)}
.vx-avatar img{width:100%;height:100%;object-fit:cover}
.vx-qui{flex:1;min-width:0;display:flex;flex-direction:column}
.vx-qui strong{color:var(--voox-title,#0B0F14)}
.vx-qui small{font-size:12.5px;color:var(--voox-text,#46536A)}
.vx-chiffre{min-width:110px;text-align:right;font-size:13px;color:var(--voox-text,#46536A)}
.vx-chiffre b{color:var(--voox-title,#0B0F14);font-size:15px}

/* La porte depuis la boutique. */
.vx-bandeau{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin:22px 0 0;padding:18px 22px;border-radius:16px;background:var(--voox-dark-gradient,linear-gradient(90deg,#000 0%,#161B22 100%));color:rgba(255,255,255,.8)}
.vx-bandeau strong{display:block;color:#fff;font-size:16px;margin-bottom:2px}
.vx-bandeau .voox-btn{background:#fff;color:#0B0F14}

@media (max-width: 760px){
  .vx-etapes,.vx-niveaux{grid-template-columns:1fr}
  .vx-classement li{flex-wrap:wrap}
  .vx-chiffre{min-width:0;text-align:left}
  .vx-moi{padding:20px}
}