/* ============================================================
   v99-ui-premium.css  (claude-uipremium-1)  [2026-06-22]
   ------------------------------------------------------------
   « Plus loin » sur le polish : effets PREMIUM additifs et SÛRS.
   - balayage lumineux (sheen) au survol sur les boutons SANS pseudo existant
     (.action-btn/.mode-btn/.buy-btn + onglets de guilde) → overflow:hidden OK
     car contenu interne. PAS sur .nav-btn / .equip-slot / .defi-luxe-btn
     (ils ont déjà ::before / leur propre brillance → on ne touche pas).
   - glow d'ombre au survol via FILTER (ne clippe pas, s'empile avec les box-shadow inline).
   - SVG d'en-tête/nav plus nets + halo.
   - cartes (boutique/packs) : bordure qui s'éclaire + glow au survol.
   - onglets actifs : liseré lumineux.
   GPU only (transform/filter) → fluide. Hover-transition (pas d'animation
   infinie) → non tué par le mode fluidité ; auto-off quand l'onglet est en
   arrière-plan (body.mx-bg-paused, géré par v96-claude-perf.js). Chargée APRÈS button-polish.
   ============================================================ */

/* ---------- 1) SHEEN (balayage lumineux) au survol ---------- */
.action-btn, .mode-btn, .buy-btn,
#guild-screen button[onclick*="MX_guildTab"],
.mx-aui-mode, .coopb-mode-card {
  position: relative;
  overflow: hidden;
}
.action-btn::after, .mode-btn::after, .buy-btn::after,
#guild-screen button[onclick*="MX_guildTab"]::after,
.mx-aui-mode::after {
  content: '';
  position: absolute; top: 0; bottom: 0; left: -130%;
  width: 55%;
  background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,.30) 50%, transparent 100%);
  transform: skewX(-16deg);
  transition: left .6s cubic-bezier(.25,.8,.3,1);
  pointer-events: none;
  z-index: 3;
}
.action-btn:hover::after, .mode-btn:hover::after, .buy-btn:hover::after,
#guild-screen button[onclick*="MX_guildTab"]:hover::after,
.mx-aui-mode:hover::after {
  left: 155%;
}

/* ---------- 2) GLOW d'ombre au survol (clip-free, s'empile) ---------- */
.nav-btn:hover:not(:disabled),
.defi-luxe-btn:hover,
.action-btn:hover:not(:disabled), .mode-btn:hover:not(:disabled), .buy-btn:hover:not(:disabled),
#guild-screen button:hover:not(:disabled) {
  filter: brightness(1.1) saturate(1.06) drop-shadow(0 6px 14px rgba(0,0,0,.42));
}

/* ---------- 3) SVG plus nets + halo dans la nav / l'en-tête ---------- */
.nav-btn svg, .psp-res-svg, .action-btn svg, #guild-screen button svg, .mx-set-action svg {
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.45));
  transition: transform .15s cubic-bezier(.2,.8,.3,1), filter .15s ease;
}
.nav-btn:hover svg, .action-btn:hover svg, #guild-screen button:hover svg {
  transform: scale(1.1);
  filter: drop-shadow(0 0 6px rgba(255,255,255,.55));
}

/* ---------- 4) CARTES (boutique / packs / inventaire) — survol riche ---------- */
.equip-slot, .gem-pack, .market-item, .inv-item {
  transition: transform .16s cubic-bezier(.2,.8,.3,1), box-shadow .2s ease, border-color .2s ease, filter .18s ease !important;
}
.equip-slot:hover, .gem-pack:hover, .market-item:hover, .inv-item:hover {
  transform: translateY(-3px);
  border-color: rgba(255,215,128,.55) !important;
  filter: brightness(1.05) drop-shadow(0 10px 22px rgba(0,0,0,.45));
}

/* ---------- 5) ONGLETS ACTIFS : liseré lumineux animé ---------- */
.lx-tab, .mx-set-tab, #market-screen .nav-btn, #guild-screen button[onclick*="MX_guildTab"] {
  position: relative;
}
.lx-tab.active::after, .mx-set-tab.active::after {
  content: ''; position: absolute; left: 14%; right: 14%; bottom: -1px; height: 3px;
  border-radius: 3px;
  background: linear-gradient(90deg, transparent, currentColor, transparent);
  opacity: .9; filter: drop-shadow(0 0 4px currentColor);
  pointer-events: none;
}

/* ---------- 6) GUILDE : bandeau + emblème plus vivants ---------- */
.mx-guild-banner { transition: box-shadow .25s ease; }
.mx-guild-banner:hover { box-shadow: 0 6px 26px rgba(0,0,0,.45); }
.mx-gp-logo, .mx-gc-logo { transition: transform .18s cubic-bezier(.2,.8,.3,1); }
.mx-gp-logo:hover, .mx-gc-logo:hover { transform: scale(1.06) rotate(-2deg); }

/* ---------- 7) sécurité : rien de tout ça quand l'onglet est en arrière-plan ---------- */
body.mx-bg-paused .action-btn::after,
body.mx-bg-paused .mode-btn::after,
body.mx-bg-paused .buy-btn::after { transition: none !important; }

/* ============================================================
   8) PROFIL — barres XP/Or arrondies + glossy, cartes de stats vivantes
   ============================================================ */
/* barre XP : fill + track arrondis (le track contient #profile-xp-bar) */
#profile-xp-bar { border-radius: 6px !important; }
#profile-xp-gold-block div:has(> #profile-xp-bar) { border-radius: 6px !important; }
/* barre Or : track + fill arrondis (le fill est l'enfant direct doré) */
#profile-gold ~ div, #profile-xp-gold-block > div:last-child > div:last-child { border-radius: 5px !important; }
#profile-xp-gold-block > div:last-child > div:last-child > div { border-radius: 5px !important; }
/* gloss : reflet haut sur les remplissages de barre */
#profile-xp-bar::before {
  content:''; position:absolute; inset:0 0 50% 0;
  background:linear-gradient(180deg, rgba(255,255,255,.28), transparent);
  border-radius:6px 6px 0 0; pointer-events:none;
}
/* cartes de stats : glow doux + lift au survol (clip-free) */
#profile-screen .stat-card-2026 { transition: transform .16s cubic-bezier(.2,.8,.3,1), box-shadow .2s ease, filter .18s ease !important; }
#profile-screen .stat-card-2026:hover {
  transform: translateY(-3px);
  filter: brightness(1.06) drop-shadow(0 8px 18px rgba(0,0,0,.42));
}
/* cadre d'avatar du profil : halo qui respire légèrement au survol */
#profile-avatar-frame { transition: box-shadow .25s ease, transform .2s ease; }
#profile-avatar-frame:hover { transform: scale(1.02); box-shadow: 0 0 26px rgba(129,236,255,.4); }

/* ============================================================
   9) GUILDE — barre d'onglets segmentée + lignes membres + panneaux
   ============================================================ */
/* la barre d'onglets (div inline + classe .mx-guild-tabs ajoutée par wire()) → segmented control net */
.mx-guild-tabs {
  background: rgba(0,0,0,.32) !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.5), inset 0 0 0 1px rgba(255,255,255,.04) !important;
  border-radius: 14px !important;
}
/* lignes de membres / lignes de classement → fond doux + glissement au survol */
#guild-screen [class*="member"], #guild-screen [data-mx-avatar-uid] {
  transition: transform .15s ease, background-color .18s ease, box-shadow .18s ease !important;
  border-radius: 10px;
}
#guild-screen [class*="member"]:hover, #guild-screen [data-mx-avatar-uid]:hover {
  transform: translateX(3px);
  background-color: rgba(255,255,255,.04) !important;
}
/* boutons d'action de guilde (contribuer/booster/acheter) : un peu plus de relief */
#guild-screen button:not([onclick*="MX_guildTab"]):hover:not(:disabled) {
  box-shadow: 0 5px 16px rgba(0,0,0,.4);
}
/* le corps d'onglet de guilde apparaît en douceur */
#mx-guild-tabbody { animation: mxGuildFade .25s ease; }
@keyframes mxGuildFade { from { opacity:0; transform: translateY(4px); } to { opacity:1; transform:none; } }