/* ==========================================================================
   AntalyaV — thème Tebex. Chargé après shared.css (Exo) : il le surcharge.
   Pour changer la DA : modifier uniquement le bloc "Jetons de DA".
   ========================================================================== */

/* ---- Jetons de DA -------------------------------------------------------- */
:root {
  --av-header-h: 72px;
  --av-bg: #050905;
  --av-panel: #0a110c;
  --av-panel2: #0d1910;
  --av-line: rgb(244 250 245 / 11%); /* filets neutres (avant : vert #1e482c) */
  --av-green: #006F32;
  --av-deep: #004621;
  --av-green-soft: #69cf8c;
  --av-text: #f4faf5;
  --av-muted: #afc0b4;
  --av-font-title: "Bricolage Grotesque", Archivo, Arial, sans-serif;
  --av-font-body: Archivo, Arial, sans-serif;
  --av-radius: 6px;
  --av-radius-sm: 4px;
  --av-gutter: 16px;
  --av-max: 1200px;

  /* Branchement des variables Exo sur la DA */
  --color-text: var(--av-text);
  --color-text-darker: var(--av-muted);
  --color-text-secondary: var(--av-muted);
  --color-text-dark: var(--av-bg);
  --color-bg: var(--av-bg);
  --color-brighter-bg: var(--av-panel);
  --color-primary: var(--av-green);
  --color-primary-hover: var(--av-green-soft);
  --color-primary-text: #fff;
  --color-primary-text-hover: var(--av-bg);
  --color-secondary: var(--av-panel2);
  --color-secondary-hover: var(--av-line);
  --color-secondary-text: var(--av-text);
  --color-secondary-text-hover: var(--av-text);
  --color-tertiary-hover: rgb(105 207 140 / 12%);
  --color-sale-banner-bg: var(--av-green);
  --color-sale-banner-text: #fff;
  --content-inner-width: var(--av-max);
  --tebex-legal-footer-background-color: var(--av-panel);
  --tebex-legal-footer-border-color: var(--av-line);
  --tebex-legal-footer-text-color: var(--av-muted);
}
@media (width > 600px) { :root { --av-gutter: 24px; } }
@media (width > 960px) { :root { --av-gutter: 40px; } }

/* ---- Base ---------------------------------------------------------------- */
html { scrollbar-color: var(--av-line) var(--av-bg); }
body.av-theme {
  background: var(--av-bg);
  color: var(--av-text);
  font-family: var(--av-font-body);
  -webkit-font-smoothing: antialiased;
  overflow-x: clip; /* « clip » et pas « hidden » : sinon le body devient un conteneur de défilement et le bandeau ne colle plus */
}
body.av-theme .site { font-size: 15px; gap: 0; }
/* Focus clavier : plus de cadre vert. Liens et champs : contour fin clair ; boutons : même effet qu'au survol (voir plus bas) */
:where(a, button, input, select, textarea):focus-visible {
  outline: 1px solid rgb(244 250 245 / 55%);
  outline-offset: 3px;
}

/* ---- Utilitaires --------------------------------------------------------- */
.av-wrap { width: 100%; max-width: calc(var(--av-max) + var(--av-gutter) * 2); margin: 0 auto; padding: 0 var(--av-gutter); }
.av-section { padding: 56px 0; }
@media (width > 960px) { .av-section { padding: 80px 0; } }
.av-kicker {
  display: block; color: var(--av-muted); font: 600 12px/1 var(--av-font-body);
  letter-spacing: .12em; text-transform: uppercase;
}
.av-title {
  margin-top: 12px; font: 900 clamp(34px, 6vw, 64px)/.92 var(--av-font-title);
  text-transform: uppercase; letter-spacing: .01em;
}
.av-title .av-accent, .av-accent { color: var(--av-green-soft); }
.av-lead { margin-top: 16px; max-width: 60ch; color: var(--av-muted); font-size: 16px; line-height: 1.6; }
.av-card {
  background: var(--av-panel);
  border: 1px solid var(--av-line);
  border-radius: var(--av-radius);
}

/* ---- Boutons (les nôtres + ceux d'Exo) ----------------------------------- */
.av-btn, .btn-primary, .btn-secondary {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; padding: 0 20px; border-radius: var(--av-radius-sm);
  font: 700 14px/1 var(--av-font-body); letter-spacing: .02em;
  transition: background-color .15s, color .15s, border-color .15s, transform .15s;
}
.av-btn-primary, .btn-primary { background: var(--av-text); color: var(--av-bg); }
/* Exo remplit en vert un bouton qui garde le focus après un clic (.btn-primary:focus) : on garde l'aspect normal */
.btn-secondary:focus { background: transparent; color: var(--av-text); }
.btn-tertiary:focus { background-color: var(--btn-color-bg); color: var(--btn-color-text); }
.av-btn-primary:focus, .btn-primary:focus { background: var(--av-text); color: var(--av-bg); }
.av-btn-primary:hover, .btn-primary:hover,
.av-btn-primary:focus-visible, .btn-primary:focus-visible { background: #ffffff; color: var(--av-bg); box-shadow: inset 0 -3px 0 var(--av-green-soft); outline: 0; }
.av-btn-ghost, .btn-secondary { background: transparent; color: var(--av-text); border: 1px solid var(--av-line); }
.av-btn-ghost:hover, .btn-secondary:hover,
.av-btn-ghost:focus-visible, .btn-secondary:focus-visible { border-color: var(--av-green-soft); color: var(--av-green-soft); outline: 0; }
.av-btn:active, .btn-primary:active, .btn-secondary:active { transform: translateY(1px); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ---- En-tête ------------------------------------------------------------- */
.av-header {
  position: sticky; top: 0; z-index: 50; max-width: none; padding: 0;
  border-bottom: 1px solid var(--av-line);
}
/* Le flou est sur un pseudo-élément : un backdrop-filter sur l'en-tête lui-même
   enfermerait le menu mobile (position: fixed) dans la hauteur de l'en-tête. */
.av-header::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: rgb(5 9 5 / 82%); backdrop-filter: blur(12px);
}
.av-header .site-header-inner {
  display: flex; align-items: center; gap: 16px; min-height: 72px;
  padding-top: 0; padding-bottom: 0;
}
.av-logo { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; }
.av-logo img { width: 40px; height: auto; }
.av-logo-text { font: 900 22px/1 var(--av-font-title); text-transform: uppercase; letter-spacing: .02em; }
.av-header-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.av-header-actions .user-actions { display: flex; gap: 8px; }
.av-header .toggle-navigation { display: none; }

/* Navigation horizontale (ordinateur) */
.av-nav.navigation-horizontal { background: none; }
.av-nav .menu { display: flex; gap: 4px; }
.av-nav .menu > li > a {
  display: block; padding: 10px 14px; border-radius: var(--av-radius-sm);
  color: var(--av-muted); font-weight: 600;
}
.av-nav .menu > li > a:hover, .av-nav .menu > li.active > a { color: var(--av-text); background: rgb(105 207 140 / 10%); }
.av-nav .menu > li.active > a { color: var(--av-green-soft); }
.av-nav .mobile-only, .av-nav .close-navigation { display: none; }

/* Mobile : même logique qu'Exo — .av-nav = fond plein écran (un clic dessus ferme),
   .menu = panneau qui sort de la gauche (main.js : glisser vers la gauche pour fermer). */
@media (width <= 960px) {
  .av-header .toggle-navigation { display: inline-flex; }
  .av-btn-discord { display: none; }
  .av-header .user-name { display: none; }
  .av-nav .mobile-only { display: block; }
}
@media (width <= 420px) {
  .av-logo-text { display: none; }
  .av-header-actions .av-btn, .av-header-actions .btn-primary { padding: 0 14px; }
}

/* Neutralise la mise en page d'en-tête d'Exo (hauteur 355 px, boutons en absolu) */
body.av-theme .av-header .site-header-inner { position: static; height: auto; padding: 0 var(--av-gutter); flex-wrap: nowrap; }
body.av-theme .av-header .log-in, body.av-theme .av-header .user-actions { position: static; }
body.av-theme .av-nav .menu > li > a { padding: 10px 14px; max-width: none; }
@media (width > 960px) {
  body.av-theme .av-nav { visibility: visible; opacity: 1; }
  body.av-theme .av-nav .menu { padding: 0; background: none; font-size: 15px; line-height: 1.2; translate: none; scale: 1; opacity: 1; }
}
@media (width <= 960px) {
  body.av-theme .av-nav {
    position: fixed; inset: 0; z-index: 60; background: rgb(5 9 5 / 70%);
    transition: opacity .2s ease, visibility .2s;
  }
  body.av-theme:not(.show-navigation) .av-nav { visibility: hidden; opacity: 0; }
  body.av-theme.show-navigation .av-nav { visibility: visible; opacity: 1; }
  body.av-theme .av-nav .menu {
    position: absolute; inset: 0 auto 0 0; width: min(320px, 86vw);
    display: flex; flex-direction: column; gap: 2px; padding: 80px 16px 24px;
    background: var(--av-panel); border-right: 1px solid var(--av-line);
    font-size: 16px; line-height: 1.2; color: var(--av-muted);
    translate: 0 0; scale: 1; opacity: 1; transition: translate .25s ease;
  }
  body.av-theme:not(.show-navigation) .av-nav .menu { translate: -100% 0; }
  body.av-theme .av-nav .close-navigation {
    display: inline-flex; position: absolute; top: 16px; right: auto;
    left: calc(min(320px, 86vw) - 60px); z-index: 1;
  }
}

/* ---- Pied de page -------------------------------------------------------- */
.av-footer { margin-top: 40px; border-top: 1px solid var(--av-line); background: var(--av-panel); }
.av-footer .site-footer-inner { display: grid; gap: 28px; padding-top: 40px; padding-bottom: 40px; }
.av-footer-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; }
.av-footer-links { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.av-footer-links a { color: var(--av-muted); font-weight: 600; }
.av-footer-links a:hover { color: var(--av-green-soft); }
.av-footer .we-accept { display: flex; flex-wrap: wrap; gap: 10px; }
.av-footer .we-accept img { height: 28px; width: auto; border-radius: 4px; background: #fff; padding: 3px 6px; }
.av-footer-legal { display: grid; gap: 6px; color: var(--av-muted); font-size: 13px; line-height: 1.5; }
.av-disclaimer { color: var(--av-text); font-weight: 700; letter-spacing: .03em; }
.av-footer-legal a { color: var(--av-green-soft); }

/* ---- Accueil : hero « affiche » ------------------------------------------
   L'image fait le travail : le nom du serveur, une ligne, un bouton. */
.av-hero {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; align-items: flex-end;
  min-height: min(820px, 92svh);
  margin-top: calc(var(--av-header-h) * -1); /* l'image passe sous le bandeau transparent */
  padding: calc(var(--av-header-h) + 40px) 0 clamp(40px, 8vh, 88px);
}
.av-hero::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  background: var(--av-hero-image) 62% 35% / cover no-repeat;
}
.av-hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(0deg, var(--av-bg) 0%, rgb(5 9 5 / 55%) 28%, transparent 55%),
    linear-gradient(180deg, rgb(5 9 5 / 60%) 0%, transparent 22%);
}
.av-hero-title {
  font: 900 clamp(64px, 13vw, 168px)/.82 var(--av-font-title);
  text-transform: uppercase; letter-spacing: -.01em;
  text-shadow: 0 2px 24px rgb(0 0 0 / 35%);
}
.av-hero-sub {
  margin-top: 14px; color: var(--av-text); opacity: .85;
  font: 600 clamp(15px, 1.6vw, 18px)/1.3 var(--av-font-body); letter-spacing: .02em;
}
.av-hero-cta { margin-top: 26px; }
@media (width <= 600px) {
  .av-hero { min-height: 78svh; }
  .av-hero::before { background-image: var(--av-hero-image-sm, var(--av-hero-image)); background-position: 30% 30%; }
  .av-hero-cta { width: 100%; }
}

/* ---- Accueil : catégories ------------------------------------------------ */
.av-category-grid {
  display: grid; gap: 16px; margin-top: 32px;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
}
.av-category {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px;
  min-height: 180px; padding: 22px; overflow: hidden;
  transition: border-color .2s, transform .2s;
}
.av-category:hover { border-color: var(--av-green-soft); }
.av-category-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .35; z-index: 0; }
.av-category-name, .av-category-cta { position: relative; z-index: 1; }
.av-category-name { font: 900 34px/1 var(--av-font-title); text-transform: uppercase; }
.av-category-cta { color: var(--av-green-soft); font-weight: 600; }

/* ---- Accueil : paiement sécurisé ----------------------------------------- */
.av-secure-inner { display: grid; gap: 24px; align-items: center; padding: 28px; }
@media (width > 960px) { .av-secure-inner { grid-template-columns: 1.4fr 1fr; padding: 40px; } }
.av-secure .we-accept { display: flex; flex-wrap: wrap; gap: 10px; }
.av-secure .we-accept img { height: 36px; width: auto; border-radius: 6px; background: #fff; padding: 4px 8px; }
.we-accept img[alt="Visa"] { background: #1a1f71; } /* logo Visa blanc */

/* ---- Modules placés sur l'accueil ---------------------------------------- */
.av-slot .widget { background: none; padding: 0; margin-top: 28px; border-radius: 0; }
.av-slot .widget-title { display: none; } /* le titre de section suffit */

/* Best-seller : grande carte horizontale */
.av-bestseller .store-product {
  display: grid; gap: 20px; padding: 20px; text-align: left;
  background: linear-gradient(135deg, var(--av-deep), var(--av-panel) 60%);
  border: 1px solid var(--av-green); border-radius: var(--av-radius);
}
@media (width > 760px) { .av-bestseller .store-product { grid-template-columns: 340px 1fr; align-items: center; padding: 28px; } }
.av-bestseller .store-product .image { width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: var(--av-radius-sm); }
.av-bestseller .product-title { font: 900 40px/1 var(--av-font-title); text-transform: uppercase; }

/* Paiements récents : bandeau défilant pleine largeur */
.av-marquee {
  overflow: hidden; margin-top: 28px;
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.av-marquee-track {
  display: flex; gap: 0; width: max-content;
  animation: av-marquee var(--av-marquee-duration, 40s) linear infinite;
}
.av-marquee:hover .av-marquee-track { animation-play-state: paused; }
@keyframes av-marquee { to { transform: translateX(-50%); } }
.av-marquee-track > .purchase { margin-right: 14px; }
.av-slot .av-marquee { margin-top: 0; }
.av-payments .purchase { display: flex; align-items: center; gap: 12px; min-width: 240px; padding: 14px 16px; }
.av-payments .avatar { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.av-avatar-letter { display: grid; place-items: center; background: var(--av-panel2); border: 1px solid var(--av-line); color: var(--av-green-soft); font-weight: 700; text-transform: uppercase; }
.av-payments .username { font-size: 15px; font-weight: 700; }
.av-payments time, .av-purchase-package { color: var(--av-muted); font-size: 13px; }
.av-payments .price { margin-left: auto; color: var(--av-green-soft); font-weight: 700; white-space: nowrap; }
@media (prefers-reduced-motion: reduce) {
  .av-marquee { overflow-x: auto; }
}

/* ---- En-tête de page ----------------------------------------------------- */
.av-page-head { padding: 44px 0 0; }
.av-page-head-row {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 24px;
  padding-bottom: 18px; border-bottom: 1px solid var(--av-line);
}
.av-page-head .av-page-title { margin: 0; font-size: clamp(40px, 7vw, 72px); }
.av-page-meta { color: var(--av-muted); font-size: 13px; text-align: right; }
.av-page-meta .av-refund { display: block; margin-top: 4px; }
.av-page-head .category-description { margin: 16px 0 0; padding: 0; background: none; font-size: 16px; }
body.page-category .site-content { padding-top: 24px; }
body.av-theme .site-content { padding-bottom: 24px; }

/* ---- Grille et cartes produit -------------------------------------------- */
.av-product-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 14px; }
.store-product.av-card { padding: 0; overflow: hidden; gap: 0; text-align: left; transition: border-color .15s; }
.store-product.av-card:hover { border-color: rgb(105 207 140 / 60%); }
.store-product.av-card .image-link { position: relative; display: block; }
.store-product.av-card .image { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--av-panel2); } /* visuels des packs en 4:3 : pas de recadrage */
.av-product-body { display: grid; gap: 10px; padding: 14px 16px 16px; border-top: 1px solid var(--av-line); }
.store-product .product-title { font: 900 22px/1 var(--av-font-title); text-transform: uppercase; letter-spacing: .01em; }
.store-product .price { font-size: 16px; color: var(--av-text); }
.store-product .price strong { color: var(--av-text); font-size: 22px; font-weight: 700; }
.store-product .price .discount { color: var(--av-muted); margin-right: 6px; }
.av-badge {
  position: absolute; top: 10px; left: 10px; padding: 5px 8px; border-radius: var(--av-radius-sm);
  background: var(--av-bg); color: var(--av-green-soft); font-size: 12px; font-weight: 700; text-transform: uppercase;
}
.no-products { padding: 28px; text-align: center; color: var(--av-muted); }

/* ---- Fiche produit ------------------------------------------------------- */
.store-product-full.av-card { display: grid; gap: 24px; padding: 20px; }
@media (width > 860px) { .store-product-full.av-card { grid-template-columns: 1fr 1fr; padding: 32px; } }
.store-product-full .image { width: 100%; border-radius: var(--av-radius-sm); }
.av-package-info { display: grid; gap: 18px; align-content: start; }
.store-product-full .product-title { font: 900 clamp(32px, 5vw, 48px)/1 var(--av-font-title); text-transform: uppercase; }
.store-product-full .descr { color: var(--av-muted); line-height: 1.6; }

/* ---- Pages de texte ------------------------------------------------------ */
.store-text.av-card { padding: 28px; line-height: 1.7; }
.store-text.av-card h1, .store-text.av-card h2, .store-text.av-card h3 { font-family: var(--av-font-title); text-transform: uppercase; text-align: left; }

/* ---- Popups, panier, formulaires (mécanique Exo, habillage AntalyaV) ----- */
/* Fenêtres (connexion, options, cadeau) : sans cadre, le texte posé sur un fond presque opaque */
.popup { background: rgb(5 7 6 / 94%); backdrop-filter: blur(6px); }
.popup-content { background: transparent; border: 0; box-shadow: none; }
.popup-close { border-radius: 0 var(--av-radius) 0 var(--av-radius-sm); }
/* ---- Panier (fenêtre latérale) : fond neutre, pas de blocs encadrés ni de vert plein ---- */
.basket-popup-content { background: #08090a; border-left: 1px solid var(--av-line); }
.basket .basket-header { background: none; padding-bottom: 18px; border-bottom: 1px solid var(--av-line); }
.basket .basket-title { font: 800 24px/1 var(--av-font-title); letter-spacing: -.01em; }
.basket .basket-title::before { width: 22px; height: 22px; background-color: var(--av-muted); }
.basket .basket-second-header { background: none; padding-block: 14px; border-bottom: 1px solid var(--av-line); color: var(--av-muted); font-size: 14px; font-weight: 500; }
.basket .basket-second-header .total, .basket .basket-second-header .total strong { color: var(--av-text); font-size: 15px; font-weight: 600; }
.basket .basket-items { gap: 0; padding: 0 var(--content-padding); }
.basket .basket-item, .basket-item { background: none; border: 0; border-bottom: 1px solid var(--av-line); border-radius: 0; padding: 20px 0; }
.basket .basket-item .title { font: 700 18px/1.2 var(--av-font-body); }
.basket .basket-item .title a { color: var(--av-text); }
.basket .basket-item .options { color: var(--av-muted); font-size: 13px; }
.basket .basket-item .price, .basket .basket-item .price strong { color: var(--av-text); font-size: 15px; font-weight: 600; }
.basket .basket-item .trial { background: none; color: var(--av-green-soft); padding: 0; }
.basket .quantity-field { background: transparent; border: 1px solid var(--av-line); border-radius: var(--av-radius-sm); }
.basket .quantity-field .adjust { background: transparent; color: var(--av-text); }
.basket .quantity-field .adjust:hover { background: rgb(244 250 245 / 6%); }
.basket .quantity-field input[type=number] { background: transparent; color: var(--av-text); border: 0; }
.basket .basket-item .remove { background: transparent; border: 0; color: var(--av-muted); --btn-color-text: var(--av-muted); --btn-color-text-hover: var(--av-text); }
.basket .basket-item .remove:hover { background: rgb(244 250 245 / 6%); }
.basket .basket-checkout { padding-top: 20px; border-top: 1px solid var(--av-line); }
.basket .basket-checkout h3 { color: var(--av-muted); font: 600 14px/1 var(--av-font-body); letter-spacing: .04em; }
.basket .basket-checkout .total, .basket .basket-checkout .total strong { color: var(--av-text); font: 800 26px/1 var(--av-font-title); }
.store-form input[type=text], .store-form input[type=email], .store-form select, .store-form textarea,
.gift-form-popup input {
  width: 100%; min-height: 46px; padding: 0 14px;
  background: var(--av-bg); border: 1px solid var(--av-line); border-radius: var(--av-radius-sm); color: var(--av-text);
}
.store-form input:focus, .gift-form-popup input:focus { border-color: var(--av-green-soft); }
.store-form h2 { font: 900 32px/1 var(--av-font-title); text-transform: uppercase; }
.quantity-field { background: var(--av-panel2); border: 1px solid var(--av-line); border-radius: var(--av-radius-sm); }
/* Messages (ex. « FiveM ne s'ouvre pas ») : barre pleine largeur en bas, fond noir neutre, pas de bloc encadré */
.toaster { bottom: 0; max-width: none; padding: 0; gap: 0; }
.toast { height: auto; min-height: 56px; padding: 14px max(16px, calc((100vw - 1190px) / 2)); background: rgb(3 4 4); border: 0; border-top: 1px solid var(--av-line); border-radius: 0; box-shadow: none; color: var(--av-text); font-size: 14px; line-height: 1.45; }
.toast p { margin: 0; }
.toast.toast-success, .toast.toast-warning, .toast.toast-error { background: rgb(3 4 4); }
.toast.toast-warning { border-top-color: #cab600; }
.toast.toast-error { border-top-color: #e5484d; }

/* ---- Mention « aucun remboursement » ------------------------------------- */
.av-refund { color: var(--av-muted); font-size: 13px; font-weight: 500; }
.av-refund-box { margin: 12px 0 0; }

/* ---- Affichage « liste » choisi dans le panel ---------------------------- */
.av-product-list { display: grid; gap: 14px; }
.av-product-list .store-product.av-card { display: grid; grid-template-columns: 110px 1fr; align-items: center; }
.av-product-list .store-product.av-card .image { height: 100%; }
@media (width > 760px) {
  .av-product-list .store-product.av-card { grid-template-columns: 160px 1fr; }
  .av-product-list .av-product-body { grid-template-columns: 1fr auto; align-items: center; }
}

/* ---- Catégories à paliers (tiered) --------------------------------------- */
.av-tiered { background: none; padding: 0; }
.av-tiered .store-product-tiered { display: grid; gap: 14px; padding: 20px; text-align: left; }
.av-tiered .store-product-tiered .image { width: 100%; border-radius: var(--av-radius-sm); }
.av-tiered .store-product-tiered .descr { color: var(--av-muted); line-height: 1.6; }
.av-tiered .store-product-tiered.subscribed { border-color: var(--av-green-soft); }

/* ---- Bandeau du haut (refonte) -------------------------------------------
   Liens en texte, un seul bouton (« Jouer »). Sur l'accueil, il est transparent
   par-dessus l'image et devient une barre sombre dès qu'on fait défiler. */
.av-header .site-header-inner { min-height: var(--av-header-h); }
.av-header { border-bottom-color: transparent; transition: border-color .2s; }
.av-header::before { transition: opacity .2s; }
.av-link {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 6px;
  color: var(--av-text); font: 600 14px/1 var(--av-font-body); letter-spacing: .02em;
  transition: color .15s;
}
.av-link:hover { color: var(--av-green-soft); }
.av-btn-play { min-height: 40px; padding: 0 18px; }
@media (width > 960px) {
  body.av-theme .av-nav .menu > li > a {
    padding: 10px 12px; background: none;
    font: 700 17px/1 var(--av-font-title); letter-spacing: .06em; text-transform: uppercase;
    color: rgb(244 250 245 / 72%);
  }
  body.av-theme .av-nav .menu > li > a:hover { color: var(--av-text); background: none; }
  body.av-theme .av-nav .menu > li.active > a { color: var(--av-text); background: none; border-radius: 0; box-shadow: inset 0 -2px 0 var(--av-green-soft); }
}
body.page-index .av-header:not(.av-scrolled)::before { opacity: 0; }
body.page-index .av-header.av-scrolled,
body:not(.page-index) .av-header { border-bottom-color: var(--av-line); }

/* ---- Badge bonus (ajouté par antalya.js d'après le nom du pack) ---------- */
.av-bonus { margin-top: -4px; color: var(--av-green-soft); font-size: 13px; font-weight: 600; }

/* ---- Comment ça marche : bande d'infos sous le haut de page --------------- */
.av-how { border-bottom: 1px solid var(--av-line); }
.av-how-row { display: grid; grid-template-columns: repeat(3, 1fr); }
.av-how-item { display: grid; gap: 4px; padding: 22px 24px; border-left: 1px solid var(--av-line); }
.av-how-item:first-child { border-left: 0; padding-left: 0; }
.av-how-item strong { font: 900 18px/1.1 var(--av-font-title); text-transform: uppercase; letter-spacing: .04em; }
.av-how-item span { color: var(--av-muted); font-size: 14px; }
@media (width <= 760px) {
  .av-how-row { grid-template-columns: 1fr; }
  .av-how-item, .av-how-item:first-child { padding: 14px 0; border-left: 0; border-top: 1px solid var(--av-line); }
  .av-how-item:first-child { border-top: 0; }
}

/* ---- FAQ ----------------------------------------------------------------- */
.av-faq-list { display: grid; gap: 10px; margin-top: 28px; max-width: 820px; }
.av-faq-item { padding: 0; }
.av-faq-item summary {
  display: flex; justify-content: space-between; align-items: center; gap: 16px;
  min-height: 56px; padding: 14px 20px; cursor: pointer; list-style: none;
  font-weight: 700; font-size: 16px;
}
.av-faq-item summary::-webkit-details-marker { display: none; }
.av-faq-item summary::after { content: "+"; color: var(--av-green-soft); font: 900 26px/1 var(--av-font-title); transition: rotate .2s; }
.av-faq-item[open] summary::after { rotate: 45deg; }
.av-faq-item p { padding: 0 20px 18px; color: var(--av-muted); line-height: 1.6; }
.av-faq-item a { color: var(--av-green-soft); text-decoration: underline; }

/* ---- Popup de connexion -------------------------------------------------- */
.av-login-why { color: var(--av-muted); margin: 10px 0 4px; }

/* Cartes de même hauteur dans une rangée : l'espace en trop va au-dessus du prix,
   pas sous l'image ; prix et bouton alignés en bas de chaque carte. */
.store-product.av-card:not(.store-product-full) { display: flex; flex-direction: column; }
.store-product.av-card:not(.store-product-full) .image-link { flex: none; }
.store-product.av-card .av-product-body { display: flex; flex-direction: column; flex: 1; }
.store-product.av-card .av-product-body .product-actions { margin-top: auto; }

/* ---- Titres de section (accueil) : sobres, comme l'en-tête des pages boutique */
.av-section-title {
  padding-bottom: 14px; border-bottom: 1px solid var(--av-line);
  font: 900 clamp(26px, 3.4vw, 34px)/1 var(--av-font-title); text-transform: uppercase; letter-spacing: .02em;
}
.av-section { padding: 48px 0; }
@media (width > 960px) { .av-section { padding: 64px 0; } }
.av-secure-inner .av-section-title { padding-bottom: 0; border-bottom: 0; }
.av-secure-inner .av-lead { margin-top: 12px; }

/* ---- Catégories : liste façon menu de jeu --------------------------------- */
.av-cat-list { display: grid; }
.av-cat-row, .av-cat-row.av-category {
  display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 16px;
  min-height: 0; padding: 18px 0; overflow: visible; text-align: left;
  border: 0; border-bottom: 1px solid var(--av-line); border-radius: 0; background: none;
  transition: color .15s;
}
.av-cat-name { font: 900 clamp(40px, 7vw, 76px)/.9 var(--av-font-title); text-transform: uppercase; letter-spacing: .01em; }
.av-cat-go { color: var(--av-muted); font-size: 28px; transition: color .15s, transform .15s; }
.av-cat-row:hover { color: var(--av-green-soft); }
.av-cat-row:hover .av-cat-go { color: var(--av-green-soft); transform: translateX(4px); }

/* ---- Joueur connecté (en-tête) ------------------------------------------- */
.av-header-actions .av-user { display: flex; align-items: center; gap: 24px; margin-left: 16px; }
/* Pseudo et déconnexion sur une seule ligne : icône + pseudo | icône de sortie */
.av-user-id { display: flex; align-items: center; gap: 12px; min-width: 0; }
/* Pseudo FiveM : discret (texte normal + icône), pas un titre */
body.av-theme .av-user-name {
  display: inline-flex; align-items: center; gap: 6px; min-width: 0;
  color: var(--av-text); font: 600 14px/1 var(--av-font-body); text-transform: none; letter-spacing: 0;
}
.av-user-name .av-icon { flex: none; color: var(--av-muted); }
.av-user-label { max-width: 14ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Bouton panier : icône intégrée (celle d'Exo, chargée par masque, ne s'affichait pas) */
.av-basket { display: inline-flex; align-items: center; gap: 8px; }
.av-basket .av-icon { flex: none; }
.av-logout {
  display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 34px;
  padding-left: 12px; border-left: 1px solid var(--av-line); box-sizing: content-box;
  color: var(--av-muted); transition: color .15s;
}
.av-logout:hover, .av-logout:focus-visible { color: var(--av-text); }
@media (width <= 960px) {
  .av-logout { display: none; } /* « Se déconnecter » reste dans le menu */
  .av-user-label { max-width: 10ch; }
  body.av-theme .av-user-name { font-size: 13px; }
}
@media (width <= 960px) { .av-header .av-link.av-btn-discord { display: none; } } /* Discord est dans le menu */
.av-basket-player { color: var(--av-muted); font-weight: 500; }

/* ---- Comparatif VIP ------------------------------------------------------ */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.av-compare { display: grid; gap: 20px; }
.av-compare-scroll { overflow-x: auto; border: 1px solid var(--av-line); border-radius: var(--av-radius); }
.av-compare-table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: 15px; }
.av-compare-table th, .av-compare-table td { padding: 14px 18px; border-bottom: 1px solid var(--av-line); text-align: center; }
.av-compare-table tbody th[scope="row"] { text-align: left; font-weight: 500; color: var(--av-text); }
.av-compare-table td { color: var(--av-text); font-weight: 600; }
.av-compare-corner { width: 34%; }
.av-compare-tier { vertical-align: bottom; padding-top: 22px; padding-bottom: 20px; }
.av-compare-tier.is-highlight { box-shadow: inset 0 3px 0 var(--av-green-soft); }
.av-compare-name { display: block; font: 900 28px/1 var(--av-font-title); text-transform: uppercase; letter-spacing: .02em; }
.av-compare-price { display: block; margin: 8px 0 14px; color: var(--av-text); }
.av-compare-price strong { font-size: 22px; font-weight: 700; }
.av-compare-price small { color: var(--av-muted); font-size: 13px; margin-left: 4px; }
.av-compare-tier .product-actions { display: block; }
.av-compare-tier .product-actions .btn-primary { width: 100%; }
.av-compare-soon { display: inline-block; color: var(--av-muted); font-size: 13px; padding: 10px 0; }
.av-compare-group th {
  padding-top: 22px; text-align: left; background: var(--av-panel);
  color: var(--av-green-soft); font: 800 15px/1 var(--av-font-title); letter-spacing: .08em; text-transform: uppercase;
}
.av-check { display: inline-block; color: var(--av-green-soft); }
.av-dash { color: var(--av-muted); }
.av-compare-note { color: var(--av-muted); font-size: 13px; }
@media (width <= 760px) {
  .av-compare-table th, .av-compare-table td { padding: 12px 12px; font-size: 14px; }
  .av-compare-table tbody th[scope="row"], .av-compare-corner { position: sticky; left: 0; background: var(--av-bg); z-index: 1; }
  .av-compare-name { font-size: 22px; }
}

/* ---- Sans cadres ---------------------------------------------------------
   Pas de blocs encadrés : le contenu est séparé par des filets fins. */
.av-card { background: none; border: 0; border-radius: 0; }

/* FAQ : liste à filets */
.av-faq-list { gap: 0; border-top: 1px solid var(--av-line); }
.av-faq-item { border-bottom: 1px solid var(--av-line); }
.av-faq-item summary { padding: 18px 0; }
.av-faq-item p { padding: 0 0 20px; max-width: 70ch; }
.av-faq-item summary::after { content: "+"; font-weight: 400; font-family: var(--av-font-body); font-size: 24px; color: var(--av-muted); }

/* Paiement sécurisé : plus de cadre */
.av-secure-inner { padding: 0; }
@media (width > 960px) { .av-secure-inner { padding: 0; } }

/* Cartes produit : image + texte, sans cadre */
.store-product.av-card { background: none; border: 0; border-radius: 0; overflow: visible; }
.store-product.av-card .image { border-radius: var(--av-radius); }
.store-product.av-card:hover { border-color: transparent; }
.store-product.av-card:hover .product-title { color: var(--av-green-soft); }
.av-product-body { border-top: 0; padding: 14px 0 0; }
.store-product .product-title { transition: color .15s; }
.av-bonus { margin-top: -2px; }

/* Fiche produit, pages texte, comparatif, message vide : sans cadre */
.store-product-full.av-card { padding: 0; }
@media (width > 860px) { .store-product-full.av-card { padding: 0; } }
.store-text.av-card { padding: 0; }
.av-compare-scroll { border: 0; border-radius: 0; }
.av-compare-group th { background: none; }
.no-products { padding: 28px 0; text-align: left; }
.av-package-page { padding-top: 32px; }

/* Pages légales */
.av-legal-nav { display: flex; flex-wrap: wrap; gap: 6px 22px; padding: 14px 0 0; }
.av-legal-nav a { color: var(--av-muted); font-weight: 600; }
.av-legal-nav a:hover, .av-legal-nav a[aria-current="page"] { color: var(--av-text); }
.av-legal-nav a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--av-green-soft); }
.av-legal { max-width: 75ch; padding: 32px 0 24px; line-height: 1.7; color: var(--av-muted); }
.av-legal h2 { margin: 28px 0 8px; color: var(--av-text); font: 800 24px/1.1 var(--av-font-title); text-transform: uppercase; letter-spacing: .02em; }
.av-legal h2:first-child { margin-top: 0; }
.av-legal a { color: var(--av-green-soft); text-decoration: underline; }
.av-legal-list { display: grid; gap: 10px; }
.av-footer-legal-links { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 13px; }
.av-footer-legal-links a { color: var(--av-muted); }
.av-footer-legal-links a:hover { color: var(--av-text); }
body.page-legal .av-header { border-bottom-color: var(--av-line); }

/* ---- Logos de paiement : monochromes, même hauteur, sans fond ------------ */
.av-pay { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.av-pay li { display: flex; color: var(--av-muted); transition: color .15s; }
.av-pay li:hover { color: var(--av-text); }
.av-pay svg { width: 30px; height: 30px; }
.av-secure .av-pay svg { width: 36px; height: 36px; }

/* ---- Espacement des sections : plus serré (retour « trop de vide ») ------ */
.av-section { padding: 36px 0; }
@media (width > 960px) { .av-section { padding: 48px 0; } }

/* ---- Titres en Bricolage Grotesque (choix de Jason) ----------------------
   Police plus large que l'ancienne (condensée) : tailles revues à la baisse,
   graisse 800 au lieu de 900 (non disponible). */
.av-title, .av-hero-title, .av-section-title, .av-cat-name, .av-page-title,
.store-product .product-title, .store-product-full .product-title, .av-compare-name,
.av-how-item strong, .av-logo-text, .av-legal h2, .av-compare-group th,
.store-form h2, body.av-theme .av-nav .menu > li > a {
  font-weight: 800; letter-spacing: -.01em;
}
.av-hero-title { font-size: clamp(52px, 10.5vw, 136px); line-height: .9; letter-spacing: -.03em; }
.av-title { font-size: clamp(30px, 5vw, 52px); }
.av-page-head .av-page-title { font-size: clamp(36px, 6vw, 60px); }
.av-section-title { font-size: clamp(22px, 2.8vw, 28px); }
.av-cat-name { font-size: clamp(34px, 6vw, 64px); letter-spacing: -.02em; }
.store-product .product-title { font-size: 20px; }
.store-product-full .product-title { font-size: clamp(28px, 4vw, 40px); }
.av-compare-name { font-size: 22px; }
.av-how-item strong { font-size: 16px; letter-spacing: 0; }
.av-logo-text { font-size: 19px; }
.av-legal h2 { font-size: 20px; }
@media (width > 960px) {
  body.av-theme .av-nav .menu > li > a { font-size: 14px; letter-spacing: .02em; }
}

/* Pages légales affichées dans l'accueil selon ?info=… (voir index.html) */
.av-legal-page { display: none; }
html[data-legal] .av-home { display: none; }
html[data-legal="mentions-legales"] .av-legal-page[data-legal-page="mentions-legales"],
html[data-legal="cgv"] .av-legal-page[data-legal-page="cgv"],
html[data-legal="confidentialite"] .av-legal-page[data-legal-page="confidentialite"] { display: block; }

/* En-tête connecté sur petit écran : le pseudo laisse la place au panier (il reste visible dans le panier) */
@media (width <= 520px) {
  body.av-theme .av-header .av-user-id { display: none; }
  .av-header-actions .av-user { margin-left: 0; }
  .av-basket span { display: none; }
  .av-header-actions .av-basket { padding: 0 12px; }
}

/* Comparatif VIP : phrase d'accroche sous le nom */
.av-compare-tagline { display: block; max-width: 26ch; margin: 8px auto 12px; color: var(--av-muted); font-size: 13px; line-height: 1.4; font-weight: 400; text-transform: none; }
@media (width <= 760px) { .av-compare-tagline { display: none; } }