/* =====================================================================
   v106-tech-borders-2.css  (claude-v106-1)  [2026-07-27]
   ÉTEND les bordures techniques HUD (crochets de coins + cadre net +
   double-liseré) aux écrans que v105 ne couvrait pas : INVENTAIRE (slots
   équipés / vides), DISTRICT MARCHAND & achat d'équipement (Équip. du Jour,
   familiers, sorts, HDV, boutique gemmes) et CENTRE D'ENTRAÎNEMENT (paliers,
   sous-onglets, programme Maigrir, panneau fitness).
   Chargée EN DERNIER (après v105). 100% STATIQUE + additive.
   Sélecteurs + pseudo-élément LIBRE vérifiés par cartographie (wf_68f748bb-534)
   pour NE PAS écraser un sheen/glow/double-line/anneau-de-rareté existant.
   Tous les pseudos sont pointer-events:none, inset POSITIF (compatible
   overflow:hidden), z-index adapté (au-dessus des overlays quand nécessaire).
   ===================================================================== */

/* crochets réutilisés de v105 ; redéfinis ici pour être auto-suffisant */
:root {
  --hudc: rgba(255, 210, 130, 0.9);
  --mx-hud:
    linear-gradient(var(--hudc), var(--hudc)) top left     / 14px 2px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) top left     / 2px 14px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) top right    / 14px 2px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) top right    / 2px 14px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) bottom left  / 14px 2px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) bottom left  / 2px 14px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) bottom right / 14px 2px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) bottom right / 2px 14px no-repeat;
  --mx-hud-ticks:
    linear-gradient(var(--hudc), var(--hudc)) top left     / 16px 2px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) top left     / 2px 16px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) top right    / 16px 2px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) top right    / 2px 16px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) bottom left  / 16px 2px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) bottom left  / 2px 16px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) bottom right / 16px 2px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) bottom right / 2px 16px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) top center    / 2px 8px no-repeat,
    linear-gradient(var(--hudc), var(--hudc)) bottom center / 2px 8px no-repeat;
}

/* =====================================================================
   1) INVENTAIRE — slots d'équipement ÉQUIPÉS et VIDES.
   v105 ne les touche PAS (leur classe est .invp-slot, pas .equip-slot).
   ::after est LIBRE (v99-rarity-frames ne réutilise ::after que sur le
   MYTHIQUE = couronne → on l'exclut). On garde la bordure de rareté
   (codage couleur) et on n'ajoute des crochets qu'en ::after.
   ===================================================================== */
#inventory-grid .invp-slot:not(.invp-slot-empty),
#inventory-grid .invp-slot-empty { position: relative; }

#inventory-grid .invp-slot:not(.invp-slot-empty):not(.invp-r-mythic)::after,
#inventory-grid .invp-slot-empty::after {
  content: ""; position: absolute; inset: 5px; pointer-events: none; z-index: 3;
  background: var(--mx-hud); opacity: .5;
}
/* slot vide : cadre or net à la place du pointillé fade */
#inventory-grid .invp-slot-empty { border-color: rgba(255, 205, 120, 0.28) !important; }

/* =====================================================================
   2) MARCHÉ « Équipements du Jour » — VRAIES cartes = petits-enfants
   (.mx-equipdaily-grid > div), pas les wrappers #market-screen .grid-3>div.
   ::before ET ::after LIBRES, position:relative déjà inline, badges en coins
   (rareté / niveau) inoffensifs, pas d'overflow:hidden. Frame complète.
   ===================================================================== */
#market-grid .mx-equipdaily-grid > div { position: relative; }
#market-grid .mx-equipdaily-grid > div::before {
  content: ""; position: absolute; inset: 6px; pointer-events: none; z-index: 4;
  background: var(--mx-hud); opacity: .5;
}
#market-grid .mx-equipdaily-grid > div::after {
  content: ""; position: absolute; inset: 3px; border-radius: 9px;
  border: 1px solid rgba(255, 205, 120, 0.12); pointer-events: none; z-index: 1;
}

/* =====================================================================
   3) MARCHÉ — cartes FAMILIERS & SORTS (#familiars-shop / #spells-shop > div).
   ::before/::after LIBRES (v105 ne pose que border+position sur ces divs).
   On cible les grilles SPÉCIFIQUES pour ne PAS toucher les wrappers equipdaily.
   Crochets seuls (grandes cartes chargées → pas de double-line pour rester lisible).
   ===================================================================== */
#familiars-shop > div, #spells-shop > div { position: relative; }
#familiars-shop > div::before, #spells-shop > div::before {
  content: ""; position: absolute; inset: 6px; pointer-events: none; z-index: 3;
  background: var(--mx-hud); opacity: .45;
}

/* =====================================================================
   4) HÔTEL DES VENTES — cartes d'annonce (.hdv2-card).
   ::before/::after LIBRES, position:relative déjà là, seule l'étoile favori
   en coin. On garde la bordure de rareté inline + frame HUD complète.
   ===================================================================== */
#hdv2-screen .hdv2-card::before {
  content: ""; position: absolute; inset: 6px; pointer-events: none; z-index: 3;
  background: var(--mx-hud); opacity: .5;
}
#hdv2-screen .hdv2-card::after {
  content: ""; position: absolute; inset: 3px; border-radius: 9px;
  border: 1px solid rgba(255, 205, 120, 0.12); pointer-events: none; z-index: 0;
}

/* =====================================================================
   5) BOUTIQUE GEMMES.
   - packs de gemmes = .mx-gp-card (::before LIBRE ; ::after = étoile popular ;
     position:relative + overflow:hidden déjà → crochets inset positif OK).
   - petites cartes = .gem-item (static → relative ; 2 pseudos libres).
   - cartes premium image/vidéo = div[onclick^="buyGemItem"] (overlay absolu
     inset:0 → crochets z-index élevé pour rester visibles).
   (.gem-pack de v105 est une classe MORTE : la vraie carte est .mx-gp-card.)
   ===================================================================== */
#gem-shop-content .mx-gp-card::before {
  content: ""; position: absolute; inset: 6px; pointer-events: none; z-index: 4;
  background: var(--mx-hud); opacity: .5;
}
#gem-shop-content .gem-item { position: relative; }
#gem-shop-content .gem-item::before {
  content: ""; position: absolute; inset: 5px; pointer-events: none; z-index: 3;
  background: var(--mx-hud); opacity: .42;
}
#gem-shop-content div[onclick^="buyGemItem"]::before {
  content: ""; position: absolute; inset: 7px; pointer-events: none; z-index: 5;
  background: var(--mx-hud); opacity: .55;
  filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.6));
}

/* =====================================================================
   6) CENTRE D'ENTRAÎNEMENT.
   ===================================================================== */
/* Fix fuite v105 §2 : ses crochets ::before débordaient sur la BARRE d'onglets
   (#mx-train-cats) et la racine Maigrir (#mxsl-root), enfants directs de
   #training-tiers → on les retire (ce ne sont pas des cartes de palier). */
#training-tiers > #mx-train-cats::before,
#training-tiers > #mxsl-root::before { display: none !important; content: none !important; }

/* Sous-onglets de catégorie (Sans matériel / Running / Salle / Maigrir) :
   cadre or net (boutons petits → pas de crochets). */
#mx-train-cats > button { border-color: rgba(255, 205, 120, 0.30) !important; }

/* Cartes de PALIER : ::before = crochets (déjà posés par v105 §2) ; on complète
   avec un double-liséré interne en ::after (LIBRE). :not() pour éviter les 2 wrappers. */
#training-tiers > div:not(#mx-train-cats):not(#mxsl-root) { position: relative; }
#training-tiers > div:not(#mx-train-cats):not(#mxsl-root)::after {
  content: ""; position: absolute; inset: 6px; border-radius: 11px;
  border: 1px solid rgba(255, 205, 120, 0.12); pointer-events: none; z-index: 0;
}

/* Programme MAIGRIR : crochets en teinte MAGENTA (respecte l'identité rose du
   module) sur les cartes de mode d'intensité + les cartes de config. */
#mxsl-root .mxsl-mode, #mxsl-root .mxsl-card { position: relative; }
#mxsl-root .mxsl-mode::before, #mxsl-root .mxsl-card::before {
  content: ""; position: absolute; inset: 6px; pointer-events: none; z-index: 3;
  --hc: rgba(255, 150, 235, 0.85);
  background:
    linear-gradient(var(--hc), var(--hc)) top left     / 14px 2px no-repeat,
    linear-gradient(var(--hc), var(--hc)) top left     / 2px 14px no-repeat,
    linear-gradient(var(--hc), var(--hc)) top right    / 14px 2px no-repeat,
    linear-gradient(var(--hc), var(--hc)) top right    / 2px 14px no-repeat,
    linear-gradient(var(--hc), var(--hc)) bottom left  / 14px 2px no-repeat,
    linear-gradient(var(--hc), var(--hc)) bottom left  / 2px 14px no-repeat,
    linear-gradient(var(--hc), var(--hc)) bottom right / 14px 2px no-repeat,
    linear-gradient(var(--hc), var(--hc)) bottom right / 2px 14px no-repeat;
  opacity: .5;
}

/* Panneau PROGRAMME FITNESS (grande surface flottante) + cartes de quête. */
#fitness-quest-panel { position: relative; }
#fitness-quest-panel::before {
  content: ""; position: absolute; inset: 8px; pointer-events: none; z-index: 3;
  background: var(--mx-hud-ticks); opacity: .5;
}
#fitness-quest-panel div[onclick*="toggleFitnessQuest"] { position: relative; }
#fitness-quest-panel div[onclick*="toggleFitnessQuest"]::before {
  content: ""; position: absolute; inset: 4px; pointer-events: none; z-index: 2;
  background: var(--mx-hud); opacity: .4;
}
