.toastify {
    padding: 12px 20px;
    color: #ffffff;
    display: inline-block;
    background: var(--main);
    position: fixed;
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
    border-radius: 2px;
    cursor: pointer;
    text-decoration: none;
    max-width: 351px;
    z-index: 2147483647;
    padding-right: 45px;
    overflow: hidden;
}


.toastify.on {
    opacity: 1;
}

.push-notification:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: var(--main);
    animation: backgroundAnimate 4.5s cubic-bezier(.15,.85,.45,1) forwards;
    transform-origin: left;
    width: 100%;
}

.toastify .push-notification + .toast-close {
  color: var(--heading);
}
.push-notification {
    color: var(--heading);
    display: flex;
    align-items: center;
    max-width: 351px;
    
}
.push-notification .mess-inner {
    padding-left: 16px;
}
.push-notification .mess-inner label {
    font-weight: 700;
    font-size: 16px;
}
.push-notification img {
       width: 40px;
}
.push-notification p.d-block {
    font-size: 12px;
    opacity: .5;
}
.push-notification .view {
    color: var(--main);
    text-decoration: underline;
    display: inline-block;
    margin-left: 6px;
}
.toastify .toast-close {
    position: absolute;
    top: 10px;
    right:15px;
    padding: 0;
    border: 0;
    background: transparent;
    color:#fff;
    font-size:0;
    &::before{
        width:20px;
        height:20px;
        content:'\E814';
        font-family:"jws_icon";
        font-size:20px;
    }
}

.toast-close img {
    display: none !important;
}


.toastify-right {
    right: 15px;
}

.toastify-left {
    left: 15px;
}

.toastify-top {
    top: -150px;
}

.toastify-bottom {
    bottom: -150px;
}

.toastify-rounded {
    border-radius: 25px;
}

.toastify-avatar {
    width: 1.5em;
    height: 1.5em;
    margin: -7px 5px;
    border-radius: 2px;
}

.toastify-center {
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    max-width: fit-content;
    max-width: -moz-fit-content;
}

.jws-matching-clear span[data-name]:after {
    content: '\e814';
    font-family: "jws_icon";
}

@keyframes backgroundAnimate {
  from {
     transform: scaleX(0);
  }

  to {
     transform: scaleX(1);
  }
}
/* ═══════════════════════════════════════════════════════
   JWS MATCH — GymCrush v2.0
   Flèches Tinder + Bloc Upgrade + Anti-glitch
   ═══════════════════════════════════════════════════════ */

/* ── Anti-glitch : les cartes utilisent GPU compositing ── */
.tinder--card {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  isolation: isolate;
}

/* ── Flèches Tinder ────────────────────────────────────── */
.jws-arrow-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 100;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 18px rgba(0,0,0,0.18);
  transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275),
              box-shadow 0.2s ease,
              opacity 0.2s ease;
  outline: none;
}

.jws-arrow-left {
  left: -28px;
  background: #fff;
  color: #e74c3c;
}

.jws-arrow-right {
  right: -28px;
  background: #fff;
  color: #e91e8c;
}

.jws-arrow-btn .arrow-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  transition: transform 0.2s ease;
}

.jws-arrow-btn:hover {
  box-shadow: 0 6px 28px rgba(0,0,0,0.26);
}

.jws-arrow-left:hover {
  transform: translateY(-50%) scale(1.12);
}

.jws-arrow-right:hover {
  transform: translateY(-50%) scale(1.12);
}

.jws-arrow-left:active {
  transform: translateY(-50%) scale(0.95);
}

.jws-arrow-right:active {
  transform: translateY(-50%) scale(0.95);
}

/* Cacher les flèches sur mobile (swipe suffisant) */
@media (max-width: 767px) {
  .jws-arrow-btn {
    display: none;
  }
}

/* ── Compteur de swipes ────────────────────────────────── */
.swipe-counter-box {
  text-align: center;
  font-size: 13px;
  margin-bottom: 10px;
  color: var(--heading, #333);
  opacity: 0.75;
}

.swipe-counter {
  display: inline-block;
  font-weight: 700;
  min-width: 22px;
  text-align: center;
  transition: color 0.3s ease, transform 0.2s ease;
}

.swipe-counter.low {
  color: #e74c3c;
  animation: swipe-pulse 0.5s ease;
}

@keyframes swipe-pulse {
  0%, 100% { transform: scale(1); }
  50%       { transform: scale(1.35); }
}

/* ── Bloc Upgrade (mur de swipes) ─────────────────────── */
.jws-upgrade-block {
  position: absolute;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.35s ease;
  border-radius: inherit;
  /* Fond semi-transparent avec blur */
  background: rgba(255,255,255,0.92);
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}

.jws-upgrade-block.visible {
  opacity: 1;
  pointer-events: auto;
}

.jws-upgrade-inner {
  text-align: center;
  padding: 32px 24px;
  max-width: 320px;
}

.jws-upgrade-inner img {
  margin-bottom: 16px;
  animation: rocket-bounce 1.8s ease-in-out infinite;
}

@keyframes rocket-bounce {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-8px); }
}

.jws-upgrade-inner h4 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 8px;
}

.jws-upgrade-inner p {
  font-size: 14px;
  margin-bottom: 20px;
  opacity: 0.8;
}

.jws-upgrade-inner .jws-btn-premium {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 16px;
}

.jws-upgrade-separator {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 0;
  opacity: 0.4;
  font-size: 12px;
}

.jws-upgrade-separator::before,
.jws-upgrade-separator::after {
  content: "";
  flex: 1;
  height: 1px;
  background: currentColor;
}

.jws-timer-label {
  font-size: 13px;
  margin-bottom: 6px;
  opacity: 0.7;
}

/* ══════════════════════════════════════════════════════════
   GALLERY PHOTOS — remplace .avatar > a qui n'existe plus
   Spécificité élevée pour écraser les CSS personnalisés du thème
   ══════════════════════════════════════════════════════════ */

/* .avatar doit être position:relative pour que la gallery en absolute fonctionne */
.jws-match-discover.layout2 .tinder--card .avatar.pos-rel {
  position: relative !important;
}

/* La gallery occupe tout le .avatar */
.jws-match-discover.layout2 .tinder--card .avatar .profile-avatar-gallery {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  padding: 0 !important;        /* annule le padding:4px de votre CSS perso */
  margin: 0 !important;
  z-index: 2 !important;
  border-radius: 0 !important;
  background: none !important;  /* annule le background gradient de votre CSS perso */
  -webkit-tap-highlight-color: transparent;
}

/* Slides et images en pleine hauteur, sans débordement */
.jws-match-discover.layout2 .tinder--card .avatar .profile-avatar-gallery .swiper-wrapper,
.jws-match-discover.layout2 .tinder--card .avatar .profile-avatar-gallery .swiper-slide {
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

.jws-match-discover.layout2 .tinder--card .avatar .profile-avatar-gallery .swiper-slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Forcer overflow:hidden sur le conteneur avatar pour que rien ne dépasse */
.jws-match-discover.layout2 .tinder--card .avatar.pos-rel {
  overflow: hidden !important;
}

/* Lien profil : zone centrale uniquement (40% milieu de la photo) */
.jws-match-discover.layout2 .tinder--card .avatar .gc-profile-link-center {
  position: absolute !important;
  top: 0;
  bottom: 0;
  left: 30%;
  width: 40%;
  z-index: 6;
  cursor: pointer;
  display: block;
  -webkit-tap-highlight-color: transparent;
}

/* ── Bouton Rewind dans tinder--buttons ─────────────────── */
.jws-match-discover.layout2 .tinder--buttons .btn-rewind,
.jws-match-discover.layout2 .tinder--buttons .jws-undo-currentuser {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.15) !important;
  text-decoration: none !important;
  color: #f5a623 !important;
  line-height: 1 !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  flex-shrink: 0;
}

.jws-match-discover.layout2 .tinder--buttons .btn-rewind i,
.jws-match-discover.layout2 .tinder--buttons .btn-rewind i::before,
.jws-match-discover.layout2 .tinder--buttons .jws-undo-currentuser i,
.jws-match-discover.layout2 .tinder--buttons .jws-undo-currentuser i::before {
  color: #f5a623 !important;
  font-size: 20px !important;
  width: auto !important;
  height: auto !important;
  line-height: 1 !important;
  display: block !important;
}

.jws-match-discover.layout2 .tinder--buttons .btn-rewind:hover,
.jws-match-discover.layout2 .tinder--buttons .jws-undo-currentuser:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 18px rgba(0,0,0,0.22) !important;
}

/* ── Timer 3D extrusion (style Nouvel An) ───────────────── */
.jws-timer-3d {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  margin-top: 14px;
  line-height: 1;
}

.tc-num {
  font-family: 'Arial Black', 'Arial Bold', Impact, sans-serif;
  font-size: 62px;
  font-weight: 900;
  color: #ffffff;
  /* Extrusion 3D multi-couches */
  text-shadow:
    1px 1px 0 #b0b8d0,
    2px 2px 0 #9aa3bc,
    3px 3px 0 #848ea8,
    4px 4px 0 #6e7994,
    5px 5px 0 #586480,
    6px 6px 0 #424f6c,
    7px 7px 0 #2c3a58,
    8px 8px 12px rgba(0,0,0,0.6);
  display: inline-block;
  min-width: 0.62em;
  text-align: center;
  transition: color 0.15s ease;
  letter-spacing: -1px;
}

/* Séparateur : */
.tc-sep-3d {
  font-family: 'Arial Black', 'Arial Bold', Impact, sans-serif;
  font-size: 56px;
  font-weight: 900;
  color: rgba(255,255,255,0.5);
  text-shadow:
    1px 1px 0 rgba(176,184,208,0.5),
    2px 2px 0 rgba(154,163,188,0.5),
    3px 3px 0 rgba(66,79,108,0.4);
  display: inline-block;
  margin: 0 1px;
  padding-bottom: 6px;
  align-self: flex-start;
  margin-top: 4px;
}

/* Animation pulse au changement de chiffre */
@keyframes tc-pulse-anim {
  0%   { transform: scale(1);    color: #ffffff; }
  25%  { transform: scale(1.15); color: #a0d4ff; }
  60%  { transform: scale(1.05); color: #d0e8ff; }
  100% { transform: scale(1);    color: #ffffff; }
}

.tc-num.tc-pulse {
  animation: tc-pulse-anim 0.35s ease-out forwards;
}

/* ── Bouton Profil dans tinder--buttons ─────────────────── */
.jws-match-discover.layout2 .tinder--buttons .btn-profile-link {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 64px !important;
  height: 64px !important;
  border-radius: 50% !important;
  background: #fff !important;
  box-shadow: 0px 0px 21px rgba(0,0,0,0.15) !important;
  text-decoration: none !important;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.jws-match-discover.layout2 .tinder--buttons .btn-profile-link i,
.jws-match-discover.layout2 .tinder--buttons .btn-profile-link i::before {
  color: #4285f4 !important;
  font-size: 28px !important;
  line-height: 1 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
}

.jws-match-discover.layout2 .tinder--buttons .btn-profile-link:hover {
  transform: scale(1.1);
}

/* ── Bouton "Changer de salle" 3D doré ──────────────────── */
.jws-match-discover .choix-salle,
.jws-discover-filter .choix-salle {
  background: none !important;
  padding: 0 !important;
  height: auto !important;
  border-radius: 0 !important;
  display: inline-block !important;
}

.jws-match-discover .choix-salle a.elementor-button,
.jws-discover-filter .choix-salle a.elementor-button {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  padding: 12px 22px !important;
  border-radius: 50px !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  color: #fff !important;
  text-shadow:
    1px 1px 2px rgba(0,0,0,0.55),
    0 2px 6px rgba(0,0,0,0.3) !important;
  text-decoration: none;
  line-height: 1.2;
  letter-spacing: 0.3px;
  /* Fond doré 3D */
  background:
    linear-gradient(
      180deg,
      #ffe066 0%,
      #f5c200 18%,
      #e0a800 50%,
      #c98a00 80%,
      #b37700 100%
    ) !important;
  /* Effet relief : bordure + ombre */
  border: none !important;
  outline: 3px solid rgba(180, 100, 0, 0.5) !important;
  outline-offset: 1px;
  box-shadow:
    /* Reflet interne haut */
    inset 0 2px 6px rgba(255,255,255,0.55),
    /* Ombre interne bas */
    inset 0 -3px 8px rgba(0,0,0,0.25),
    /* Bordure rose/violet externe (comme sur la capture) */
    0 0 0 3px rgba(200, 50, 200, 0.75),
    /* Relief 3D bas */
    0 6px 0 #7a4a00,
    /* Ombre portée */
    0 8px 18px rgba(0,0,0,0.55) !important;
  transform: translateY(0);
  transition: transform 0.1s ease, box-shadow 0.1s ease !important;
  position: relative;
}

.jws-match-discover .choix-salle a.elementor-button:hover,
.jws-discover-filter .choix-salle a.elementor-button:hover {
  transform: translateY(-2px) !important;
  box-shadow:
    inset 0 2px 6px rgba(255,255,255,0.55),
    inset 0 -3px 8px rgba(0,0,0,0.25),
    0 0 0 3px rgba(200, 50, 200, 0.75),
    0 8px 0 #7a4a00,
    0 12px 22px rgba(0,0,0,0.5) !important;
}

.jws-match-discover .choix-salle a.elementor-button:active,
.jws-discover-filter .choix-salle a.elementor-button:active {
  transform: translateY(4px) !important;
  box-shadow:
    inset 0 2px 6px rgba(255,255,255,0.55),
    inset 0 -3px 8px rgba(0,0,0,0.25),
    0 0 0 3px rgba(200, 50, 200, 0.75),
    0 2px 0 #7a4a00,
    0 4px 8px rgba(0,0,0,0.4) !important;
}

/* Icône diamant dans le bouton */
.jws-match-discover .choix-salle a.elementor-button i,
.jws-discover-filter .choix-salle a.elementor-button i {
  font-size: 22px !important;
  color: #fff !important;
  filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.4));
  flex-shrink: 0;
}

/* ── Fix : icônes boutons masquées pendant le swipe ─────── */
/* La CSS perso ".tinder_love .jws-icon-heartfill:before" est trop large,
   elle écrase aussi les icônes des boutons. On restore ici. */
.tinder_love .tinder--buttons .jws-icon-heartfill:before {
  content: '\e837' !important;
}
.tinder_nope .tinder--buttons .jws-icon-cross:before {
  content: '\e814' !important;
}

/* ── Explosion bouton like / nope — clone fixe sur body ─── */
@keyframes jws-btn-clone-pop {
  0%   { transform: scale(1);   opacity: 1; box-shadow: 0 0 0 0   var(--jws-ring); }
  45%  { transform: scale(2.2); opacity: 1; box-shadow: 0 0 0 18px transparent; filter: brightness(2.5); }
  100% { transform: scale(0.4); opacity: 0; box-shadow: 0 0 0 26px transparent; }
}

.jws-btn-pop-clone {
  position: fixed;
  pointer-events: none;
  z-index: 99998;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  background: #fff;
  animation: jws-btn-clone-pop 0.6s ease-out forwards;
}

.jws-btn-pop-clone.pop-love {
  --jws-ring: rgba(255, 88, 120, 0.8);
  color: var(--accent, #ff88ff);
}

.jws-btn-pop-clone.pop-nope {
  --jws-ring: rgba(145, 110, 255, 0.8);
  color: var(--main, #916eff);
}

/* ── Particules burst like/nope ─────────────────────────── */
@keyframes jws-burst {
  0%   { opacity: 1; transform: translate(0, 0) scale(1); }
  100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(0); }
}

.jws-particle {
  position: fixed;
  pointer-events: none;
  font-size: 18px;
  z-index: 99999;
  animation: jws-burst 0.75s ease-out forwards;
}

/* ── Effet cliquable boutons chat ───────────────────────── */
.meassage-media .button,
.meassage-media #send-emoji,
.meassage-media #send-gif,
.meassage-media #send-file {
  transition: transform 0.1s ease, box-shadow 0.1s ease !important;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.18);
  overflow: visible !important;
  cursor: pointer;
  user-select: none;
}

.meassage-media #send-gif:active,
.meassage-media #send-file:active {
  transform: scale(0.88);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.meassage-media #send-emoji:active {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.meassage-media .elementor-button[disabled],
.meassage-tool button.elementor-button[disabled] {
  opacity: 0.42 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
  pointer-events: none;
  filter: none !important;
}

.jws-chat-members .chat-content .message-item.me .message-wrap {
    background: #D9FDD3;
}

.meassage-media .elementor-button:not([disabled]),
.meassage-tool button.elementor-button:not([disabled]) {
  transition: box-shadow 0.1s ease, color 0.1s ease !important;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.22);
  cursor: pointer;
  opacity: 1 !important;
  overflow: visible !important;
}

.meassage-media .elementor-button:not([disabled]):active,
.meassage-tool button.elementor-button:not([disabled]):active {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 3px 6px rgba(0, 0, 0, 0.28);
  color: #2ecc71 !important;
}

.meassage-tool button[type="submit"].loading .text {
  opacity: 1 !important;
  color: #2ecc71 !important;
}

/* ── Layout2 : card s'adapte (hauteur auto, vh explicite) ── */

/* info-right masqué */
.jws-match-discover.layout2 .info-right {
  display: none !important;
}

/* Override min-height:100vh du CSS perso — c'était la cause du "trop grand" */
.jws-match-discover.layout2 .loaded .tinder--card {
  min-height: 0 !important;
}

/* Card : hauteur auto (JS set container à 0px, height:100% = 0) */
.jws-match-discover.layout2 .tinder--card {
  height: auto !important;
}

/* Row et card : marges annulées */
.jws-match-discover.layout2 .tinder--card > .row {
  height: auto !important;
  margin: 0 !important;
}

/* info-left : BLOCK (pas flex) + position:relative pour ancrer les boutons absolus
   En flex, les éléments absolus perdent leur position naturelle (après l'avatar)
   et remontent en haut → boutons mal positionnés */
.jws-match-discover.layout2 .tinder--card .info-left {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  height: auto !important;
  padding: 0 !important;
  display: block !important;
  position: relative !important;
}

/* Avatar : hauteur vh explicite selon présence .gc-vote-box dans la CARD
   (pas body, pour gérer chaque card indépendamment) */
.jws-match-discover.layout2 .tinder--card:has(.gc-vote-box) .avatar.pos-rel.jws-avatar,
.jws-match-discover.layout2 .tinder--card:has(.gc-vote-box) .avatar {
  height: 52vh !important;
  max-height: none !important;
  min-height: 0 !important;
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
}

.jws-match-discover.layout2 .tinder--card:not(:has(.gc-vote-box)) .avatar.pos-rel.jws-avatar,
.jws-match-discover.layout2 .tinder--card:not(:has(.gc-vote-box)) .avatar {
  height: 65vh !important;
  max-height: none !important;
  min-height: 0 !important;
  display: block !important;
  position: relative !important;
  overflow: hidden !important;
}

/* Annule no-vote-block du thème enfant */
.jws-match-discover.layout2 .tinder--card.no-vote-block .avatar {
  min-height: unset !important;
}

/* Sticky conversation header */
.conversation-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: inherit;
}