/* =====================================================
   OUTILS DEBUG ANGLE CAMERA - DESACTIVES (garder pour plus tard)
   Bouton 📐 sur les cartes, overlay vert d'events, bouton "Copy angle"
   des modales. Pour les reactiver : supprimer ce bloc.
   ===================================================== */
.dbg-save-angle,
#skrlDebug,
.pack-modal__3d-capture,
.cat-pack__capture { display: none !important; }

/* Protection assets : pas de glisser-deposer natif, pas de menu long-press iOS,
   pas de selection, sur les images de packs + le rendu 3D. (Le clic droit +
   le dragstart sont aussi bloques en JS dans widgets.js.) */
.cat-pack img,
.pack-modal img,
.skrl-modal img,
.recent-item img,
model-viewer {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  user-drag: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

/* =====================================================
   PAGE COMPTE (account.html) - style IKEA Family
   ===================================================== */

/* Etat non connecte */
.acc-empty{
  max-width:480px;margin:4rem auto;
  text-align:center;
  padding:2.8rem 2.2rem;
  border:1px solid var(--gris-bord);
  border-radius:18px;
  background:#fff;
  box-shadow:0 14px 44px rgba(88,101,242,.10);
}
.acc-empty__badge{
  width:74px;height:74px;margin:0 auto 1.3rem;
  display:flex;align-items:center;justify-content:center;
  border-radius:20px;
  background:rgba(88,101,242,.12);
  color:#5865F2;
}
.acc-empty__badge svg{width:40px;height:40px}
.acc-empty h3{
  font-size:1.4rem;font-weight:800;
  color:var(--texte);margin:0 0 .5rem;
}
.acc-empty p{
  color:var(--texte-sec);margin:0 0 1.7rem;
}
.acc-empty__btn{
  display:inline-flex;align-items:center;gap:.6rem;
  background:#5865F2;color:#fff;border:none;
  padding:.9rem 1.6rem;border-radius:10px;
  font-family:inherit;font-size:.95rem;font-weight:700;
  cursor:pointer;
  transition:filter .15s var(--ease),transform .15s var(--ease);
}
.acc-empty__btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.acc-empty__btn svg{width:18px;height:18px;flex:none}

/* Layout : sidebar + contenu (pleine largeur, aligne au logo) */
.acc-layout{
  padding:2.5rem clamp(1rem,4vw,2.5rem) 4rem;
}
.acc-section__title{
  margin:0 0 1rem;
  font-size:clamp(1.2rem,2vw,1.5rem);
  font-weight:800;
  color:var(--texte);
}
.acc-logout{
  align-self:flex-start;
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.75rem 1.4rem;
  border:1px solid var(--gris-bord);
  border-radius:8px;
  background:var(--blanc);
  color:#c0392b;font-weight:700;font-size:.95rem;
  text-decoration:none;
  transition:background .15s var(--ease);
}
.acc-logout:hover{background:#fdecea}
.acc-housing__intro{
  margin:0 0 1rem;
  font-size:.95rem;color:var(--texte-sec);
}
.acc-housing{
  display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;
}
.acc-housing__field{
  font-family:inherit;font-size:.95rem;
  padding:.7rem .9rem;
  border:1px solid var(--gris-bord);
  border-radius:8px;
  background:var(--blanc);color:var(--texte);
  min-width:230px;
}
.acc-housing__field:focus{outline:none;border-color:var(--bleu)}
.acc-housing__btn{
  font-family:inherit;font-size:.95rem;font-weight:700;
  padding:.7rem 1.5rem;
  border:none;border-radius:8px;
  background:var(--bleu);color:#fff;cursor:pointer;
  transition:filter .15s var(--ease);
}
.acc-housing__btn:hover{filter:brightness(.93)}
.acc-housing__btn:disabled{opacity:.6;cursor:default}
.acc-housing__saved{
  color:#1a7f37;font-weight:700;font-size:.9rem;
}

/* Formulaire resume du compte (grille 2 colonnes) */
.acc-form{
  border:1px solid var(--gris-bord);
  border-radius:12px;
  background:var(--blanc);
  padding:1.6rem;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.2rem 1.4rem;
}
.acc-form__field{
  display:flex;flex-direction:column;gap:.4rem;
}
.acc-form__label{
  font-size:.82rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.03em;
  color:var(--texte-sec);
}
.acc-form__box{
  padding:.7rem .9rem;
  border:1px solid var(--gris-bord);
  border-radius:8px;
  background:var(--gris-bg);
  font-size:.95rem;font-weight:700;color:var(--texte);
}
.acc-form__select,
.acc-form__input{
  width:100%;
  padding:.7rem .9rem;
  border:1px solid var(--gris-bord);
  border-radius:8px;
  background:var(--blanc);color:var(--texte);
  font-family:inherit;font-size:.95rem;
}
.acc-form__select:focus,
.acc-form__input:focus{outline:none;border-color:var(--bleu)}
.acc-form__foot{
  grid-column:1 / -1;
  display:flex;align-items:center;gap:.9rem;
}
.acc-form__btn{
  font-family:inherit;font-size:.93rem;font-weight:700;
  padding:.7rem 1.6rem;
  border:none;border-radius:8px;
  background:var(--bleu);color:#fff;cursor:pointer;
  transition:filter .15s var(--ease);
}
.acc-form__btn:hover{filter:brightness(.93)}
.acc-form__btn:disabled{opacity:.6;cursor:default}
.acc-form__saved{color:#23a55a;font-weight:700;font-size:.88rem}
.acc-form__saved svg{width:22px;height:22px;vertical-align:middle}

/* Menu deroulant custom (coins arrondis) */
.cdrop{position:relative}
.cdrop__trigger{
  width:100%;
  display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  padding:.7rem .9rem;
  border:1px solid var(--gris-bord);
  border-radius:8px;
  background:var(--blanc);color:var(--texte);
  font-family:inherit;font-size:.95rem;
  cursor:pointer;text-align:left;
}
.cdrop__trigger:hover{border-color:var(--texte-sec)}
.cdrop.is-open .cdrop__trigger{border-color:var(--bleu)}
.cdrop__arrow{
  width:18px;height:18px;flex:none;color:var(--texte-sec);
  transition:transform .15s var(--ease);
}
.cdrop.is-open .cdrop__arrow{transform:rotate(180deg)}
.cdrop__list{
  position:absolute;left:0;right:0;top:calc(100% + 6px);
  z-index:30;
  margin:0;padding:.35rem;list-style:none;
  background:var(--blanc);
  border:1px solid var(--gris-bord);
  border-radius:10px;
  box-shadow:0 12px 30px -10px rgba(0,0,0,.3);
  max-height:300px;overflow-y:auto;
}
.cdrop__opt{
  padding:.55rem .7rem;
  border-radius:6px;
  font-size:.93rem;color:var(--texte);
  cursor:pointer;
}
.cdrop__opt:hover{background:var(--gris-bg)}
.cdrop__opt.is-selected{background:var(--bleu);color:#fff}
.acc-form__photo-btn{
  padding:.7rem .9rem;
  border:1px solid var(--gris-bord);
  border-radius:8px;
  background:var(--gris-bg);
  font-family:inherit;font-size:.93rem;font-weight:700;
  color:var(--texte);cursor:pointer;text-align:left;
  transition:background .15s var(--ease);
}
.acc-form__photo-btn:hover{background:#ececec}
@media (max-width:560px){
  .acc-form{grid-template-columns:1fr}
}
.acc-summaryhead__title{
  margin:0 0 .3rem;
  font-size:clamp(1.2rem,2vw,1.5rem);
  font-weight:800;
  color:var(--texte);
}
.acc-summaryhead__text{
  margin:0;
  font-size:.95rem;
  color:var(--texte-sec);
}

/* Sidebar : texte seul, aligne au bord, barre bleue pour l'item actif */
.acc-nav{
  display:flex;flex-direction:column;
}
.acc-nav__item{
  position:relative;
  display:block;
  padding:.85rem 0;
  text-decoration:none;
  color:var(--texte-sec);
  font-size:1rem;font-weight:500;
  transition:color .15s var(--ease);
}
.acc-nav__item:hover{
  color:var(--texte);
  text-decoration:underline;
  text-underline-offset:3px;
}
.acc-nav__item.is-active{
  color:var(--texte);
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:3px;
}
.acc-nav__item.is-active::before{
  content:'';
  position:absolute;
  left:-14px;top:.6rem;bottom:.6rem;
  width:3px;border-radius:2px;
  background:var(--bleu);
}
.acc-nav__item--logout{
  color:#c0392b;
  margin-top:.5rem;
}
.acc-nav__item--logout:hover{
  color:#c0392b;
}

/* Contenu */
.acc-main{
  display:flex;flex-direction:column;gap:2rem;
}

/* Banniere bleue */
.acc-hero{
  position:relative;overflow:visible;
  background:
    radial-gradient(circle at 85% 15%, rgba(255,255,255,.10), transparent 55%),
    linear-gradient(135deg, rgba(10,10,10,.82) 0%, rgba(30,30,30,.74) 100%),
    url('../assets/account-banner.png');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  border-radius:0;
  margin-left:calc(-1 * clamp(1rem,4vw,2.5rem));
  margin-right:calc(-1 * clamp(1rem,4vw,2.5rem));
  padding:2.6rem clamp(1.5rem,4vw,2.8rem);
  min-height:240px;
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  color:#fff;
}
.acc-hero::before{
  content:'';
  position:absolute;inset:0;
  background-image:url('../assets/grain.png');
  opacity:.1;
  pointer-events:none;
}
.acc-hero__text,
.acc-hero__avatar{position:relative;z-index:1}
.acc-hero__title{
  font-size:clamp(1.8rem,3.4vw,2.6rem);
  font-weight:800;
  margin:0 0 1.1rem;
  letter-spacing:-.01em;
}
.acc-hero__badges{
  display:flex;flex-wrap:wrap;gap:.5rem;
}
.acc-hero__badge{
  display:inline-block;
  padding:.44rem 1rem;
  border-radius:999px;
  font-size:.85rem;font-weight:800;
  letter-spacing:.02em;
  background:rgba(255,255,255,.22);color:#fff;
}
.acc-hero__badge--yellow{
  background:var(--jaune);
  color:#1a1a1a;
}
.acc-since{
  display:flex;align-items:center;gap:.65rem;
  padding:1rem 1.3rem;
  background:var(--gris-bg);
  border:1px solid var(--gris-bord);
  border-radius:12px;
  font-size:.95rem;font-weight:600;
  color:var(--texte);
}
.acc-since svg{width:18px;height:18px;color:var(--bleu);flex:none}

/* Stats du compte */
.acc-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.25rem;
}
.acc-stat{
  background:var(--gris-bg);
  border:1px solid var(--gris-bord);
  border-radius:12px;
  padding:1.5rem;
  min-height:170px;
  display:flex;flex-direction:column;justify-content:space-between;
}
.acc-stat__icon{
  width:44px;height:44px;border-radius:50%;
  background:var(--blanc);
  border:1px solid var(--gris-bord);
  display:flex;align-items:center;justify-content:center;
  color:var(--bleu);
}
.acc-stat__icon svg{width:20px;height:20px}
.acc-stat__value{
  display:block;
  font-size:clamp(1.4rem,2.4vw,1.85rem);
  font-weight:800;color:var(--texte);line-height:1.15;
  word-break:break-word;
}
.acc-stat__label{
  display:block;margin-top:.25rem;
  font-size:.85rem;color:var(--texte-sec);font-weight:600;
}
@media (max-width:620px){
  .acc-stats{grid-template-columns:1fr}
}
.acc-hero__avatar{
  width:208px;height:208px;
  border-radius:50%;
  border:4px solid #fff;
  flex:none;
  background:#fff;
  object-fit:cover;
  display:block;
  box-shadow:0 8px 22px rgba(0,0,0,.35);
}
.acc-hero__avatarbox{
  position:absolute;z-index:2;
  right:clamp(1.5rem,4vw,2.8rem);
  top:50%;transform:translateY(-50%);
  display:flex;flex-direction:column;align-items:center;gap:.55rem;
}
.acc-avatar-wrap{position:relative;line-height:0}
.acc-avatar-edit{
  position:absolute;right:4px;bottom:4px;z-index:3;
  width:30px;height:30px;border-radius:50%;
  background:var(--jaune);color:#1a1a1a;
  border:3px solid #fff;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;padding:0;
  transition:filter .15s var(--ease);
}
.acc-avatar-edit:hover{filter:brightness(.92)}
.acc-avatar-edit:disabled{opacity:.6;cursor:default}
.acc-avatar-edit svg{width:13px;height:13px}
.acc-avatar-logout{
  position:absolute;right:10px;bottom:10px;z-index:3;
  width:48px;height:48px;border-radius:50%;
  background:#c0392b;color:#fff;
  border:3px solid #fff;
  display:flex;align-items:center;justify-content:center;
  text-decoration:none;
  transition:filter .15s var(--ease);
}
.acc-avatar-logout:hover{filter:brightness(.9)}
.acc-avatar-logout svg{width:22px;height:22px}
.acc-avatar-reset{
  background:none;border:none;padding:0;cursor:pointer;
  color:var(--texte-sec);
  font-family:inherit;font-size:.78rem;
  text-decoration:underline;text-underline-offset:2px;
}
.acc-avatar-reset:hover{color:var(--texte)}

/* Section Demarrer : 3 cards d'acces rapide */
.acc-start__title{
  font-size:clamp(1.3rem,2.2vw,1.6rem);
  font-weight:800;
  color:var(--texte);
  margin:0 0 1.1rem;
}
.acc-start__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.25rem;
}
.acc-start-card{
  display:flex;flex-direction:column;justify-content:space-between;
  min-height:170px;
  background:var(--gris-bg);
  border:1px solid var(--gris-bord);
  border-radius:12px;
  padding:1.5rem;
  text-decoration:none;color:var(--texte);
  transition:transform .18s var(--ease),border-color .18s var(--ease),box-shadow .18s var(--ease);
}
.acc-start-card:hover{
  transform:translateY(-3px);
  border-color:var(--texte);
  box-shadow:0 10px 24px -14px rgba(0,0,0,.2);
}
.acc-start-card__icon{
  width:46px;height:46px;border-radius:50%;
  background:var(--blanc);
  border:1px solid var(--gris-bord);
  display:flex;align-items:center;justify-content:center;
  color:var(--bleu);
}
.acc-start-card__icon svg{width:22px;height:22px}
.acc-start-card h3{
  font-size:1.05rem;font-weight:700;
  color:var(--texte);margin:0;
}

@media (max-width:760px){
  .acc-layout{grid-template-columns:1fr;gap:1.4rem}
  .acc-hero{flex-direction:column;align-items:flex-start;text-align:left}
  .acc-start__grid{grid-template-columns:1fr}
}


/* ===== PAGE MY TICKETS ===== */
.tk-section{display:flex;flex-direction:column}

/* Archive tickets - boite mail */
/* Archive tickets - boite mail (s'adapte au contenu, scroll au-dela de 5 tickets) */
.tk-mail{
  display:flex;flex-direction:column;
  border:1px solid var(--gris-bord);
  border-radius:12px;
  overflow:hidden;
  background:var(--blanc);
  box-shadow:0 1px 3px rgba(0,0,0,.07);
}
.tk-mail__bar{
  flex:none;
  display:flex;align-items:center;gap:.55rem;
  padding:.75rem 1.1rem;
  border-bottom:1px solid var(--gris-bord);
  background:var(--gris-bg);
  font-size:.85rem;font-weight:800;color:var(--texte);
}
.tk-mail__bar svg{width:16px;height:16px;stroke:var(--texte-sec)}
.tk-mail__bar[hidden]{display:none}
.tk-mail__count{
  padding:.14rem .55rem;
  background:var(--bleu);color:#fff;
  font-size:.72rem;font-weight:800;
  border-radius:999px;
}
.tk-mail__clear{
  margin-left:auto;
  display:flex;align-items:center;gap:.35rem;
  padding:.38rem .7rem;
  border:1px solid var(--gris-bord);
  border-radius:7px;
  background:var(--blanc);
  color:#C2362F;
  font-size:.76rem;font-weight:800;font-family:inherit;
  cursor:pointer;
  transition:background .12s var(--ease),border-color .12s var(--ease);
}
.tk-mail__clear svg{width:14px;height:14px}
.tk-mail__clear:hover{background:#FBEAEA;border-color:#E3B7B5}
.tk-mail__list{
  max-height:250px;
  overflow-y:auto;
}
.tk-mrow{
  display:flex;align-items:center;gap:.8rem;
  padding:.72rem 1.1rem;
  border-bottom:1px solid var(--gris-bord);
  cursor:pointer;
  transition:background .12s var(--ease);
}
.tk-mrow:last-child{border-bottom:none}
.tk-mrow:hover{background:var(--gris-bg)}
.tk-mrow--open{background:#fbfcfe}
.tk-mrow .tk-badge{flex:none}
.tk-mrow__subject{
  flex:none;width:190px;
  font-weight:700;font-size:.9rem;color:var(--texte);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.tk-mrow__preview{
  flex:1;min-width:0;
  font-size:.86rem;color:var(--texte-sec);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.tk-mrow__end{
  flex:none;width:58px;
  display:flex;align-items:center;justify-content:flex-end;
}
.tk-mrow__date{
  flex:none;
  font-size:.78rem;color:var(--texte-sec);white-space:nowrap;
}
.tk-mrow__del{
  display:none;
  width:30px;height:30px;
  align-items:center;justify-content:center;
  border:none;background:none;border-radius:6px;
  color:var(--texte-sec);cursor:pointer;font-family:inherit;
  transition:background .12s var(--ease),color .12s var(--ease);
}
.tk-mrow__del svg{width:16px;height:16px}
.tk-mrow__del:hover{background:#FBEAEA;color:#C2362F}
.tk-mrow:hover .tk-mrow__date{display:none}
.tk-mrow:hover .tk-mrow__del{display:flex}
.tk-mail__view{min-width:0}
.tk-view__body{padding:1.3rem}
.tk-view__bar{
  display:flex;align-items:center;gap:.2rem;
  padding:.5rem .7rem;
  background:var(--gris-bg);
  border-bottom:1px solid var(--gris-bord);
}
.tk-view__icon{
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;
  border:none;background:none;border-radius:8px;
  color:var(--texte-sec);cursor:pointer;font-family:inherit;
  transition:background .12s var(--ease),color .12s var(--ease);
}
.tk-view__icon svg{width:18px;height:18px}
.tk-view__icon:hover{background:var(--blanc);color:var(--texte)}
.tk-view__icon--del:hover{background:#FBEAEA;color:#C2362F}
.tk-view__sep{
  width:1px;height:20px;
  background:var(--gris-bord);
  margin:0 .4rem;
}
.tk-view__head{
  padding-bottom:1rem;margin-bottom:1.2rem;
  border-bottom:1px solid var(--gris-bord);
}
.tk-view__subject{
  margin:0 0 .55rem;
  font-size:1.2rem;font-weight:800;color:var(--texte);
}
.tk-view__meta{
  display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;
}
.tk-view__date{font-size:.8rem;color:var(--texte-sec)}
.tk-view__convolabel{
  font-size:.74rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.05em;color:var(--texte-sec);
  margin-bottom:.75rem;
}

/* Popup de confirmation (remplace le confirm() du navigateur) */
.skrl-modal{
  position:fixed;inset:0;z-index:1000;
  display:flex;align-items:center;justify-content:center;
  padding:1.2rem;
  background:rgba(247,248,250,.55);
  -webkit-backdrop-filter:blur(20px);
  backdrop-filter:blur(20px);
  animation:skrlModalFade .18s var(--ease);
}
@keyframes skrlModalFade{from{opacity:0}to{opacity:1}}
.skrl-modal__card{
  position:relative;
  width:100%;max-width:430px;
  background:rgba(255,255,255,.62);
  -webkit-backdrop-filter:blur(40px) saturate(140%);
  backdrop-filter:blur(40px) saturate(140%);
  border:1px solid rgba(255,255,255,.9);
  border-radius:24px;
  padding:1.9rem;
  box-shadow:0 30px 70px rgba(0,0,0,.34),0 8px 22px rgba(0,0,0,.14);
  animation:skrlModalPop .2s var(--ease);
}
@keyframes skrlModalPop{
  from{opacity:0;transform:translateY(8px) scale(.98)}
  to{opacity:1;transform:none}
}
.skrl-modal__title{
  margin:0 0 .55rem;
  font-size:1.25rem;font-weight:800;color:var(--texte);
  letter-spacing:-.01em;
}
.skrl-modal__text{
  margin:0 0 .35rem;
  font-size:.95rem;line-height:1.5;color:var(--texte);
}
.skrl-modal__note{
  margin:0 0 1.35rem;
  font-size:.86rem;line-height:1.5;color:var(--texte-sec);
}
.skrl-modal__actions{
  display:flex;gap:.6rem;justify-content:flex-end;
}
.skrl-modal__btn{
  padding:.6rem 1.15rem;
  border-radius:8px;
  border:1px solid transparent;
  font-size:.88rem;font-weight:800;font-family:inherit;
  cursor:pointer;
  transition:background .14s var(--ease),border-color .14s var(--ease);
}
.skrl-modal__btn--ghost{
  background:var(--blanc);
  border-color:var(--gris-bord);
  color:var(--texte);
}
.skrl-modal__btn--ghost:hover{background:var(--gris-bg)}
.skrl-modal__btn--danger{background:#C2362F;color:#fff}
.skrl-modal__btn--danger:hover{background:#a82c26}
.skrl-modal__btn--primary{background:var(--bleu);color:#fff}
.skrl-modal__btn--primary:hover{background:#00468a}
.skrl-field{margin-bottom:1rem;text-align:left}
.skrl-field__label{
  display:block;margin-bottom:.35rem;
  font-size:.76rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.04em;color:var(--texte-sec);
}
.skrl-field__handle{
  display:flex;align-items:center;
  border:1px solid var(--gris-bord);border-radius:8px;
  background:var(--gris-bg);
  overflow:hidden;
  transition:border-color .14s var(--ease);
}
.skrl-field__handle span{
  padding:0 .15rem 0 .7rem;
  color:var(--texte-sec);font-weight:700;
}
.skrl-field__handle input{
  flex:1;min-width:0;
  border:0;background:none;outline:none;
  padding:.6rem .7rem .6rem .1rem;
  font-size:.92rem;font-family:inherit;color:var(--texte);
}
.skrl-field textarea{
  width:100%;
  border:1px solid var(--gris-bord);border-radius:8px;
  background:var(--gris-bg);
  padding:.6rem .7rem;
  font-size:.92rem;font-family:inherit;color:var(--texte);
  resize:vertical;outline:none;
  transition:border-color .14s var(--ease);
}
.skrl-field__input{
  width:100%;
  border:1px solid var(--gris-bord);border-radius:8px;
  background:var(--gris-bg);
  padding:.6rem .7rem;
  font-size:.92rem;font-family:inherit;color:var(--texte);
  outline:none;
  transition:border-color .14s var(--ease);
}
.skrl-field textarea:focus,
.skrl-field__input:focus,
.skrl-field__handle:focus-within{border-color:var(--bleu)}
.skrl-modal__err{
  margin:-.2rem 0 1rem;
  font-size:.84rem;font-weight:700;color:#C2362F;text-align:left;
}
@media (max-width:560px){
  .tk-mrow__subject{width:120px}
}

.tk-empty{
  text-align:center;
  padding:3.5rem 1.5rem;
  border:1px dashed var(--gris-bord);
  border-radius:14px;
  background:var(--gris-bg);
}
.tk-empty svg{width:46px;height:46px;stroke:var(--gris-bord);margin-bottom:.9rem}
.tk-empty h3{margin:0 0 .35rem;font-size:1.15rem;font-weight:800;color:var(--texte)}
.tk-empty p{margin:0;font-size:.95rem;color:var(--texte-sec)}

.tk-card{
  border:1px solid var(--gris-bord);
  border-radius:12px;
  background:var(--blanc);
  margin-bottom:.85rem;
  overflow:hidden;
}
.tk-card__head{
  display:flex;align-items:center;gap:1rem;
  padding:1.05rem 1.3rem;
  cursor:pointer;user-select:none;
  transition:background .15s var(--ease);
}
.tk-card__head:hover{background:var(--gris-bg)}
.tk-card__subject{
  flex:1;
  font-size:1.02rem;font-weight:700;color:var(--texte);
}
.tk-card__date{font-size:.84rem;color:var(--texte-sec);white-space:nowrap}

.tk-badge{
  padding:.28rem .7rem;
  border-radius:999px;
  font-size:.7rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.04em;
  white-space:nowrap;
}
.tk-badge--open{background:#E5F4EA;color:#1A7F37}
.tk-badge--closed{background:#EEE;color:#767676}

.tk-card__chevron{
  width:18px;height:18px;flex:none;
  stroke:var(--texte-sec);
  transition:transform .2s var(--ease);
}
.tk-card.is-open .tk-card__chevron{transform:rotate(180deg)}

.tk-card__body{
  display:none;
  border-top:1px solid var(--gris-bord);
  background:var(--gris-bg);
  padding:1.2rem;
}
.tk-card.is-open .tk-card__body{display:block}

.tk-msg{
  background:var(--blanc);
  border:1px solid var(--gris-bord);
  border-radius:9px;
  padding:.85rem 1rem;
  margin-bottom:.65rem;
}
.tk-msg:last-child{margin-bottom:0}
.tk-msg__top{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:1rem;margin-bottom:.4rem;
}
.tk-msg__author{font-size:.9rem;font-weight:800;color:var(--texte)}
.tk-msg__author--staff{color:var(--bleu)}
.tk-msg__time{font-size:.78rem;color:var(--texte-sec);white-space:nowrap}
.tk-msg__text{
  font-size:.93rem;line-height:1.55;color:var(--texte);
  white-space:pre-wrap;word-break:break-word;
}
.tk-note{
  text-align:center;
  font-size:.9rem;color:var(--texte-sec);
  padding:.6rem;margin:.4rem 0 0;
}

@media (max-width:560px){
  .tk-card__head{flex-wrap:wrap;gap:.6rem}
  .tk-card__subject{flex:1 1 100%}
}

/* ===== PAGE FAVORITES (liste) ===== */
.fav-item{
  display:flex;align-items:center;gap:1rem;
  padding:1rem 1.2rem;
  border:1px solid var(--gris-bord);
  border-radius:10px;
  background:var(--blanc);
  margin-bottom:.7rem;
}
.fav-item__icon{
  width:20px;height:20px;flex:none;
  color:var(--bleu);
}
.fav-item__title{
  flex:1;min-width:0;
  font-size:.98rem;font-weight:700;
  color:var(--texte);text-decoration:none;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.fav-item__title:hover{text-decoration:underline}
.fav-item__remove{
  flex:none;
  width:30px;height:30px;
  border:1px solid var(--gris-bord);
  border-radius:7px;
  background:var(--blanc);
  color:var(--texte-sec);
  font-size:1.15rem;line-height:1;
  cursor:pointer;
  transition:background .15s var(--ease),color .15s var(--ease),border-color .15s var(--ease);
}
.fav-item__remove:hover{background:#fde8e8;color:#c0392b;border-color:#f0c4c4}

/* ===== Compte - barre de favoris (style barre de favoris navigateur) ===== */
.fav-bar{
  display:flex;flex-wrap:wrap;gap:.3rem;
  max-height:92px;
  overflow-y:auto;
  padding:.5rem;
  border:1px solid var(--gris-bord);
  border-radius:10px;
  background:var(--gris-bg);
}
.fav-bar--empty{
  padding:1.4rem;
  justify-content:center;
}
.fav-bar__empty{
  font-size:.9rem;color:var(--texte-sec);
}
.fav-chip{
  display:flex;align-items:center;gap:.45rem;
  padding:.4rem .55rem;
  border-radius:6px;
  background:transparent;
  text-decoration:none;
  color:var(--texte);
  font-size:.85rem;font-weight:600;
  transition:background .12s var(--ease);
}
.fav-chip:hover{background:var(--blanc)}
.fav-chip__icon{
  width:16px;height:16px;flex:none;
  color:var(--bleu);
}
.fav-chip__label{white-space:nowrap}
.fav-chip__remove{
  display:flex;align-items:center;justify-content:center;
  width:17px;height:17px;flex:none;
  border:none;background:none;border-radius:50%;
  color:var(--texte-sec);
  font-size:1rem;line-height:1;cursor:pointer;font-family:inherit;
  opacity:0;
  transition:opacity .12s var(--ease),background .12s var(--ease),color .12s var(--ease);
}
.fav-chip:hover .fav-chip__remove{opacity:.7}
.fav-chip__remove:hover{opacity:1;background:#fde8e8;color:#c0392b}

/* ===== Compte - Packs Nitro Booster ===== */
.boost-note{
  display:flex;align-items:center;gap:1rem;
  padding:1rem 1.15rem;margin-bottom:.9rem;
  background:#f3f0ff;
  border:1px solid #e2d9ff;
  border-radius:12px;
}
.boost-note > svg{width:30px;height:30px;flex:none;color:#7c5cff}
.boost-note > div{display:flex;flex-direction:column;flex:1;min-width:0}
.boost-note strong{font-size:.95rem;color:var(--texte)}
.boost-note span{font-size:.85rem;color:var(--texte-sec)}
.boost-note__btn{
  flex:none;text-decoration:none;color:#fff;
  background:
    radial-gradient(circle at 14% 18%, rgba(226,208,255,.5), rgba(226,208,255,0) 44%),
    linear-gradient(150deg,#af6ee8,#7d4ccd);
  font-weight:700;font-size:.85rem;
  padding:.6rem 1.05rem;border-radius:999px;
  transition:filter .15s var(--ease);
}
.boost-note__btn:hover{filter:brightness(.95)}
.boost-grid{
  display:grid;gap:1rem;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
}
.boost-card{
  display:flex;flex-direction:column;
  background:var(--blanc);
  border:1px solid var(--gris-bord);
  border-radius:12px;overflow:hidden;
}
.boost-card__img{
  position:relative;width:100%;aspect-ratio:1/1;
  background:var(--gris-bg);
  display:flex;align-items:center;justify-content:center;
}
.boost-card__img img{width:100%;height:100%;object-fit:cover;display:block}
.boost-card__img--cover{background:#1a1714}
.boost-card__cover{position:absolute;inset:0;z-index:0;object-position:center}
.boost-card__img.is-locked .boost-card__cover{filter:brightness(.58) blur(1.5px)}
.boost-card__tag{
  position:absolute;top:.65rem;left:.65rem;z-index:2;
  background:#7d4ccd;color:#fff;
  font-size:.7rem;font-weight:700;letter-spacing:.02em;
  padding:.32rem .7rem;border-radius:999px;
}
.boost-card__tag--free{background:#23a55a}
.boost-card__lock{position:relative;z-index:2;width:34px;height:34px;color:var(--texte-sec);opacity:.5}
.boost-card__img--cover .boost-card__lock{
  width:40px;height:40px;color:#fff;opacity:.95;
  filter:drop-shadow(0 2px 7px rgba(0,0,0,.6));
}
.boost-card__body{
  display:flex;flex-direction:column;
  padding:.8rem .85rem .85rem;flex:1;
}
.boost-card__name{margin:0 0 .25rem;font-size:.92rem;color:var(--texte)}
.boost-card__desc{
  margin:0 0 .8rem;font-size:.8rem;color:var(--texte-sec);
  line-height:1.4;flex:1;
}
.boost-card__btn{
  display:block;text-align:center;text-decoration:none;
  font-weight:700;font-size:.85rem;
  padding:.55rem .8rem;border-radius:8px;
  color:#fff;
  background:
    radial-gradient(circle at 10% 16%, rgba(140,200,255,.38), rgba(140,200,255,0) 42%),
    radial-gradient(circle at 90% 84%, rgba(255,219,0,.3), rgba(255,219,0,0) 42%),
    #0058A3;
  transition:filter .15s var(--ease);
}
.boost-card__btn:hover{filter:brightness(1.1)}
.boost-card__btn.is-locked,
.boost-card__btn.is-soon{
  background:#e9eaee;color:#3a3d44;cursor:default;
}
.boost-card__btn.is-locked:hover,
.boost-card__btn.is-soon:hover{filter:none}
.boost-empty{font-size:.9rem;color:var(--texte-sec);margin:0}

/* Prix en promo (sale Tebex active) : original barre + reduit rouge + badge -X% */
.cat-pack__price--sale{flex-direction:column;align-items:flex-start;gap:.12rem}
.cat-pack__price-row{display:flex;align-items:center;gap:.5rem}
.cat-pack__price-old{color:var(--texte-sec,#6b7280);font-size:1rem;text-decoration:line-through}
.cat-pack__price-badge{background:#cc0008;color:#fff;font-size:.7rem;font-weight:800;padding:.1rem .42rem;border-radius:6px;letter-spacing:.02em}
.cat-pack__price--sale .cat-pack__price-now{font-size:1.55rem;font-weight:800;color:#cc0008;line-height:1}
.cat-pack__price-save{color:#cc0008;font-size:.76rem;font-weight:700}

/* carte cliquable -> ouvre la popup pack */
.boost-card--link{cursor:pointer;transition:transform .12s var(--ease),box-shadow .12s var(--ease)}
.boost-card--link:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.1)}

/* ===== Popup detail d'un pack ===== */
.pack-modal__card{
  width:100%;max-width:920px;
  min-height:640px;
  background:rgba(255,255,255,.62);
  -webkit-backdrop-filter:blur(40px) saturate(140%);
  backdrop-filter:blur(40px) saturate(140%);
  border:1px solid rgba(255,255,255,.9);
  border-radius:24px;overflow:hidden;
  max-height:88vh;display:flex;flex-direction:column;
  box-shadow:0 30px 70px rgba(0,0,0,.34),0 8px 22px rgba(0,0,0,.14);
  animation:skrlModalPop .2s var(--ease);
}
/* ===== Mode inline (product.html) : la popup rendue comme une vraie page ===== */
.skrl-modal--inline{
  position:static;inset:auto;z-index:auto;display:block;
  padding:0;background:none;animation:none;
  -webkit-backdrop-filter:none;backdrop-filter:none;
}
.skrl-modal--inline .pack-modal__card{
  max-width:1180px;margin:0 auto;
  max-height:none;animation:none;
  box-shadow:0 10px 40px rgba(0,0,0,.10);
}
.skrl-modal--inline .pack-modal__close{ display:none; }
/* Bouton "Copier le lien" produit (giveaways) - injecte dans le head de la popup */
.pack-modal__share{
  position:absolute; top:1.5rem; right:3.6rem; z-index:3;
  width:34px; height:34px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(0,0,0,.06); color:#111;
  display:inline-flex; align-items:center; justify-content:center;
  transition:background .15s var(--ease);
}
.pack-modal__share:hover{ background:rgba(0,0,0,.12); }
.pack-modal__share.is-ok{ background:#16a34a; color:#fff; }
.pack-modal__head{
  position:relative;
  padding:1rem 1.3rem .9rem;
  flex:none;
}
.pack-modal__tag{
  display:inline-block;
  background:#23a55a;color:#fff;
  font-size:.7rem;font-weight:700;letter-spacing:.02em;
  padding:.32rem .7rem;border-radius:999px;
}
.pack-modal__name{
  margin:.35rem 0 0;
  font-size:1.25rem;font-weight:800;color:var(--texte);
  letter-spacing:-.01em;
}
.pack-modal__headdesc{
  margin:.3rem 0 0;
  max-width:88%;
  font-size:.84rem;line-height:1.45;
  color:rgba(0,0,0,.6);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.pack-modal__close{
  position:absolute;top:1rem;right:1rem;
  width:34px;height:34px;border-radius:50%;border:none;cursor:pointer;
  background:rgba(0,0,0,.14);color:#000;
  display:flex;align-items:center;justify-content:center;
  transition:background .15s var(--ease);
}
.pack-modal__close:hover{background:rgba(0,0,0,.26)}
.pack-modal__close svg{width:18px;height:18px}
/* ---- layout fiche produit : galerie a onglets a gauche + infos a droite ---- */
.pack-modal__body{
  display:flex;flex:1;min-height:0;
}
.pack-modal__gallery-col{
  flex:0 0 420px;min-width:0;min-height:0;
  display:flex;flex-direction:column;gap:.9rem;
  padding:1.15rem;
  overflow:hidden;
  border-right:1px solid var(--gris-bord);
}
.pack-modal__tabs{
  display:flex;gap:.4rem;flex:none;
}
.pack-modal__tab{
  padding:.5rem 1.1rem;
  border:none;border-radius:999px;
  background:rgba(0,0,0,.05);
  font-family:inherit;font-size:.85rem;font-weight:700;
  color:var(--texte-sec);cursor:pointer;
  transition:background .14s var(--ease),color .14s var(--ease);
}
.pack-modal__tab:hover{background:rgba(0,0,0,.09)}
.pack-modal__tab.is-active{background:#111;color:#fff}
.pack-modal__pane{
  flex:1;min-height:0;display:flex;flex-direction:column;
}
.pack-modal__pane[hidden]{display:none}
.pack-modal__main{
  flex:1;min-width:0;min-height:0;
  display:flex;align-items:center;justify-content:center;
  border-radius:12px;overflow:hidden;
  box-shadow:0 12px 30px rgba(40,30,15,.20);
  background:#efece5;
}
.pack-modal__main-img{
  max-width:100%;max-height:100%;object-fit:contain;display:block;
}
.pack-modal__ovthumbs{
  flex:none;display:flex;gap:.5rem;margin-top:.7rem;
}
.pack-modal__ovthumb{
  width:64px;height:64px;padding:0;cursor:pointer;
  border-radius:9px;overflow:hidden;
  border:2px solid transparent;
  background:#fff;
  box-shadow:0 3px 9px rgba(0,0,0,.1);
  transition:border-color .14s var(--ease);
}
.pack-modal__ovthumb img{width:100%;height:100%;object-fit:cover;display:block}
.pack-modal__ovthumb.is-active{border-color:var(--bleu)}
.pack-modal__cover-empty{
  width:100%;aspect-ratio:4/3;
  display:flex;align-items:center;justify-content:center;
  font-size:.82rem;font-weight:700;color:var(--texte-sec);
  border:1.5px dashed rgba(0,0,0,.2);border-radius:14px;
  background:rgba(0,0,0,.025);
}
.pack-modal__pngall{
  flex:none;
  display:flex;align-items:center;justify-content:center;gap:.4rem;
  text-decoration:none;
  margin-bottom:.7rem;
  padding:.6rem .8rem;border-radius:9px;
  font-weight:700;font-size:.82rem;
  color:#fff;
  background:
    radial-gradient(circle at 10% 16%, rgba(255,255,255,.25), rgba(255,255,255,0) 45%),
    radial-gradient(circle at 90% 84%, rgba(0,0,0,.22), rgba(0,0,0,0) 45%),
    var(--pack-accent, #0058A3);
  transition:filter .15s var(--ease);
}
.pack-modal__pngall:hover{filter:brightness(1.1)}
.pack-modal__pngall svg{width:15px;height:15px}
.pack-modal__grid{
  flex:1;min-height:0;
  display:grid;gap:.7rem;align-content:start;
  grid-template-columns:repeat(auto-fill,minmax(112px,1fr));
  overflow-y:auto;
  scrollbar-width:none;-ms-overflow-style:none;
}
.pack-modal__grid::-webkit-scrollbar{width:0;height:0;display:none}
.pack-modal__item{
  position:relative;
  aspect-ratio:1;border-radius:12px;
  background:#fff;border:1px solid rgba(0,0,0,.06);
  box-shadow:0 5px 14px rgba(0,0,0,.08);
  display:flex;align-items:center;justify-content:center;padding:.55rem;
  cursor:pointer;
  transition:transform .12s var(--ease),box-shadow .12s var(--ease),border-color .12s var(--ease);
}
.pack-modal__item:hover{
  transform:translateY(-2px);
  box-shadow:0 9px 20px rgba(0,0,0,.14);
  border-color:color-mix(in srgb, var(--pack-accent, var(--bleu)) 35%, rgba(0,0,0,.06));
}
.pack-modal__item.is-selected{
  border-color:var(--pack-accent, var(--bleu));
  box-shadow:0 0 0 2px color-mix(in srgb, var(--pack-accent, var(--bleu)) 40%, transparent),
             0 9px 22px rgba(0,0,0,.14);
}
.pack-modal__item img{max-width:100%;max-height:100%;object-fit:contain;display:block}

/* Container 3D : position relative pour positionner le toast */
.pack-modal__3d{position:relative}

/* Bouton "Copy angle" : capture cameraOrbit + cameraTarget courant au clipboard.
   Pour calibrer la vue 3D des props directement depuis le site. */
.pack-modal__3d-capture{
  position:absolute;top:.6rem;right:.6rem;
  padding:.35rem .7rem;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(0,0,0,.08);
  border-radius:8px;
  font-size:.75rem;font-weight:600;color:var(--texte);
  cursor:pointer;
  box-shadow:0 2px 8px rgba(0,0,0,.08);
  transition:background .12s var(--ease),transform .12s var(--ease);
  z-index:3;
}
.pack-modal__3d-capture:hover{background:#fff;transform:translateY(-1px)}
.pack-modal__3d-capture.is-ok{background:#28a745;color:#fff;border-color:#28a745}

/* Debug panel live : masque (le bouton 📐 Copy angle reste fonctionnel pour capturer l'orbit) */
.pack-modal__3d-debug{
  display:none !important;
}
.pack-modal__3d-debug-row{display:flex;gap:.4rem;align-items:baseline}
.pack-modal__3d-debug-k{color:#ffd700;font-weight:700;min-width:24px}
.pack-modal__3d-debug-sep{height:1px;background:rgba(255,255,255,.15);margin:.25rem 0}

/* Toast "Coming soon" affiche dans le 3D viewer quand on click un prop sans GLB */
.pack-modal__3d-toast{
  position:absolute;bottom:.8rem;left:50%;transform:translateX(-50%);
  padding:.55rem 1rem;
  background:rgba(0,0,0,.82);color:#fff;
  border-radius:8px;
  font-size:.82rem;font-weight:600;letter-spacing:.01em;
  pointer-events:none;
  animation:packModalToast .25s var(--ease);
  z-index:2;
  max-width:90%;text-align:center;
}
@keyframes packModalToast{
  from{opacity:0;transform:translate(-50%,8px)}
  to{opacity:1;transform:translate(-50%,0)}
}
.pack-modal__empty{
  flex:1;display:flex;align-items:center;justify-content:center;
  margin:0;font-size:.9rem;color:var(--texte-sec);
}
.pack-modal__info{
  flex:1;min-width:0;min-height:0;
  display:flex;flex-direction:column;gap:.8rem;
  padding:1.4rem 1.5rem;
  overflow-y:auto;
  scrollbar-width:none;-ms-overflow-style:none;
}
.pack-modal__desc{
  margin:0;
  font-size:.95rem;line-height:1.6;color:var(--texte-sec);
}
.pack-modal__info::-webkit-scrollbar{width:0;height:0;display:none}
.pack-modal__3d{
  width:100%;flex:1;min-height:200px;
  border-radius:18px;
  border:1.5px dashed rgba(0,0,0,.2);
  background:rgba(0,0,0,.025);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;
  color:var(--texte-sec);
}
.pack-modal__3d svg{width:30px;height:30px;opacity:.55}
.pack-modal__3d span{font-size:.76rem;font-weight:700;letter-spacing:.01em}
.pack-modal__3d--live{
  border:1px solid var(--gris-bord);
  background:#efece5;
  border-radius:18px;
  overflow:hidden;
}
.pack-modal__3d--live model-viewer{
  width:100%;height:100%;display:block;
  --poster-color:transparent;
  --progress-bar-height:0px;
  --progress-bar-color:transparent;
  --progress-mask:transparent;
}
.pack-modal__btn--furn{
  display:flex;align-items:center;justify-content:center;gap:.4rem;
}
.pack-modal__btn--furn svg{width:14px;height:14px;flex:none}
.pack-modal__btn--furn:disabled{
  background:var(--gris-bg);color:var(--texte-sec);cursor:default;filter:none !important;
}
.pack-modal__btn--furn.is-ok{background:#23a55a;color:#fff}

/* Tag couleur "Free" (vert par defaut, comme .pack-modal__tag de base) */
.pack-modal__tag--free{background:#23a55a}

/* Bandeau meta : props / taille zip / housings */
.pack-modal__meta{
  display:flex;flex-wrap:wrap;gap:.4rem;
  margin:0;
}
.pack-modal__meta-item{
  display:inline-flex;align-items:center;
  font-size:.74rem;font-weight:700;letter-spacing:.02em;
  padding:.28rem .55rem;border-radius:8px;
  background:rgba(0,0,0,.05);
  color:var(--texte-sec);
}

/* Section depliable "How to install ?" */
.pack-modal__howto{
  display:flex;align-items:center;gap:.45rem;
  border:none;background:transparent;cursor:pointer;
  font-family:inherit;
  padding:.45rem 0 .25rem;margin-top:.1rem;
  font-size:.78rem;font-weight:700;
  color:var(--texte-sec);
  transition:color .14s var(--ease);
}
.pack-modal__howto:hover{color:var(--texte)}
.pack-modal__howto-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;border-radius:5px;
  background:rgba(0,0,0,.08);color:var(--texte);
  font-size:.95rem;font-weight:800;line-height:1;
}
.pack-modal__howto-body{
  background:rgba(0,0,0,.04);
  border:1px solid var(--gris-bord);
  border-radius:10px;
  padding:.7rem .9rem;
  margin-top:.2rem;
}
.pack-modal__howto-body ol{
  margin:0;padding-left:1.1rem;
  font-size:.82rem;line-height:1.55;color:var(--texte-sec);
}
.pack-modal__howto-body li{margin:.2rem 0}
.pack-modal__howto-body code{
  background:rgba(0,0,0,.08);
  padding:.1rem .35rem;border-radius:5px;
  font-family:'Cascadia Code','Consolas',monospace;font-size:.78rem;
  color:var(--texte);
}
.pack-modal__howto-body strong{color:var(--texte)}

/* Bloc apercu du furniture.lua / .sql + bouton Copy */
.pack-modal__furniture{
  flex:none;
  display:flex;flex-direction:column;gap:.45rem;
  background:rgba(0,0,0,.04);
  border:1px solid var(--gris-bord);
  border-radius:12px;
  padding:.6rem .7rem;
  max-height:170px;
}
.pack-modal__furniture-head{
  display:flex;align-items:center;justify-content:space-between;gap:.5rem;
  flex:none;
}
.pack-modal__furniture-label{
  font-size:.68rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  color:var(--texte-sec);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  flex:1;min-width:0;
}
.pack-modal__furniture-copy{
  display:flex;align-items:center;gap:.3rem;
  border:none;cursor:pointer;
  padding:.32rem .6rem;border-radius:7px;
  color:#fff;
  background:
    radial-gradient(circle at 10% 16%, rgba(255,255,255,.25), rgba(255,255,255,0) 45%),
    radial-gradient(circle at 90% 84%, rgba(0,0,0,.22), rgba(0,0,0,0) 45%),
    var(--pack-accent, #0058A3);
  font-family:inherit;font-weight:700;font-size:.72rem;
  transition:filter .14s var(--ease),background .14s var(--ease);
}
.pack-modal__furniture-copy:hover:not(:disabled){filter:brightness(1.1)}
.pack-modal__furniture-copy:disabled{background:var(--gris-bg);color:var(--texte-sec);cursor:default}
.pack-modal__furniture-copy.is-ok{background:#23a55a}
.pack-modal__furniture-copy svg{width:13px;height:13px;flex:none}
.pack-modal__furniture-pre{
  flex:1;min-height:0;
  margin:0;
  font-family:'Cascadia Code','Fira Code','Consolas',monospace;
  font-size:.72rem;line-height:1.55;
  background:#fff;
  border:1px solid var(--gris-bord);
  border-radius:8px;
  padding:.55rem .65rem;
  overflow:auto;
  white-space:pre;
  color:var(--texte);
  scrollbar-width:thin;
}
.pack-modal__furniture-pre::-webkit-scrollbar{width:6px;height:6px}
.pack-modal__furniture-pre::-webkit-scrollbar-thumb{background:rgba(0,0,0,.2);border-radius:99px}
.pack-modal__actions{
  display:flex;flex-direction:column;gap:.5rem;
  margin-top:auto;padding-top:.4rem;
}
.pack-modal__count{
  font-size:.8rem;color:var(--texte-sec);margin:0;
}
@media (max-width:640px){
  .pack-modal__body{flex-direction:column}
  .pack-modal__gallery-col{
    flex:0 0 auto;
    border-right:none;border-bottom:1px solid var(--gris-bord);
  }
  .pack-modal__info{flex:0 0 auto}
  .pack-modal__main{min-height:220px}
  .pack-modal__grid{max-height:300px}
}
.pack-modal__btn{
  display:block;text-align:center;text-decoration:none;
  border:none;
  font-family:inherit;font-weight:700;font-size:.9rem;
  padding:.7rem .8rem;border-radius:9px;
  color:#fff;
  background:
    radial-gradient(circle at 10% 16%, rgba(255,255,255,.25), rgba(255,255,255,0) 45%),
    radial-gradient(circle at 90% 84%, rgba(0,0,0,.22), rgba(0,0,0,0) 45%),
    var(--pack-accent, #0058A3);
  transition:filter .15s var(--ease);
}
.pack-modal__btn:hover{filter:brightness(1.1)}
.pack-modal__btn.is-soon{
  background:var(--gris-bg);color:var(--texte-sec);cursor:default;
}
.pack-modal__btn.is-soon:hover{filter:none}
.pack-modal__tag--booster{background:#7d4ccd}
.pack-modal__btn--boost{
  background:
    radial-gradient(circle at 14% 18%, rgba(226,208,255,.5), rgba(226,208,255,0) 44%),
    linear-gradient(150deg,#af6ee8,#7d4ccd);
  transition:filter .15s var(--ease);
}
.pack-modal__btn--boost:hover{
  background:
    radial-gradient(circle at 14% 18%, rgba(226,208,255,.5), rgba(226,208,255,0) 44%),
    linear-gradient(150deg,#af6ee8,#7d4ccd);
  filter:brightness(.96);
}
.pack-modal__btn--lua{
  color:#fff;border:none;
  background:
    radial-gradient(circle at 10% 16%, rgba(255,255,255,.25), rgba(255,255,255,0) 45%),
    radial-gradient(circle at 90% 84%, rgba(0,0,0,.22), rgba(0,0,0,0) 45%),
    var(--pack-accent, #0058A3);
  transition:filter .15s var(--ease);
}
.pack-modal__btn--lua:hover{filter:brightness(1.1)}

/* ===== Compte - #SKRLinspo (profil createur style Instagram) ===== */
.ig__head{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;gap:1.1rem;
  padding-bottom:1.6rem;margin-bottom:1.4rem;
  border-bottom:1px solid var(--gris-bord);
}
.ig__avatar{
  flex:none;
  width:130px;height:130px;
  border-radius:50%;
  overflow:hidden;
  border:1px solid var(--gris-bord);
  background:transparent;
}
.ig__avatar img{width:100%;height:100%;object-fit:cover;display:block}
.ig__info{
  min-width:0;
  display:flex;flex-direction:column;align-items:center;gap:1rem;
}
.ig__toprow{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap}
.ig__handlewrap{display:inline-flex;align-items:center;gap:.35rem}
.ig__handle{font-size:1.3rem;font-weight:500;color:var(--texte)}
.verified{
  display:inline-flex;flex:none;
  width:14px;height:14px;color:#0095f6;
}
.verified svg{width:100%;height:100%;display:block}
.ig__handlewrap .verified{width:18px;height:18px}
.ig__edit{
  padding:.5rem 1rem;
  border:1px solid var(--gris-bord);border-radius:8px;
  background:var(--gris-bg);
  font-size:.85rem;font-weight:700;font-family:inherit;
  color:var(--texte);cursor:pointer;
  transition:background .14s var(--ease);
}
.ig__edit:hover{background:#eaeaea}
.ig__follow{
  padding:.5rem 1.5rem;
  border:1px solid transparent;border-radius:8px;
  background:var(--bleu);color:#fff;
  font-size:.85rem;font-weight:800;font-family:inherit;
  cursor:pointer;
  transition:background .14s var(--ease),color .14s var(--ease);
}
.ig__follow:hover{background:#00468a}
.ig__follow.is-following{
  background:var(--gris-bg);color:var(--texte);
  border-color:var(--gris-bord);
}
.ig__btns{
  display:flex;gap:.5rem;
}
.ig__unfollow{
  padding:.5rem 1.3rem;
  border:1px solid var(--gris-bord);border-radius:8px;
  background:var(--blanc);color:var(--texte);
  font-size:.85rem;font-weight:800;font-family:inherit;
  cursor:pointer;
  transition:background .14s var(--ease);
}
.ig__unfollow:hover{background:var(--gris-bg)}
.ig-empty{
  text-align:center;padding:3rem 1rem;
  color:var(--texte-sec);font-size:.95rem;
}
/* onglets du profil createur : Profile / Following / Followers */
.ig-tabs{
  display:flex;justify-content:center;gap:.4rem;
}
.ig-tab{
  padding:.55rem 1.1rem;
  border:none;background:none;border-radius:8px;
  font-size:.85rem;font-weight:800;font-family:inherit;
  color:var(--texte-sec);cursor:pointer;
  transition:background .12s var(--ease),color .12s var(--ease);
}
.ig-tab:hover{background:var(--gris-bg)}
.ig-tab.is-active{background:var(--gris-bg);color:var(--texte)}
.ig-tab--icon{
  display:flex;align-items:center;justify-content:center;
  padding:.5rem .7rem;
}
.ig-tab--icon svg{width:18px;height:18px}
.ig-tabpane{margin-top:1.2rem}
.ig-people{
  max-height:380px;
  overflow-y:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.ig-people::-webkit-scrollbar{width:0;height:0;display:none;}
.ig-person{
  display:flex;align-items:center;gap:.8rem;
  padding:.55rem .3rem;
  border-bottom:1px solid var(--gris-bord);
}
.ig-person:last-child{border-bottom:none}
.ig-person__avatar{
  flex:none;width:42px;height:42px;border-radius:50%;
  overflow:hidden;background:var(--gris-bg);
}
.ig-person__avatar img{width:100%;height:100%;object-fit:cover;display:block}
.ig-person__name{
  flex:1;min-width:0;
  display:flex;align-items:center;gap:.3rem;
}
.ig-person__nametext{
  font-size:.92rem;font-weight:700;color:var(--texte);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.ig-person__name .verified{width:15px;height:15px;flex:none}
.ig-person__btn{
  flex:none;
  padding:.42rem 1rem;
  border:1px solid transparent;border-radius:8px;
  background:var(--bleu);color:#fff;
  font-size:.8rem;font-weight:800;font-family:inherit;
  cursor:pointer;
  transition:background .12s var(--ease),color .12s var(--ease),border-color .12s var(--ease);
}
.ig-person__btn:hover{background:#00468a}
.ig-person__btn.is-following{
  background:var(--gris-bg);color:var(--texte);border-color:var(--gris-bord);
}
.ig-person__btn.is-following:hover{background:#eaeaea}
.ig-people__empty{
  text-align:center;padding:2.5rem 1rem;
  color:var(--texte-sec);font-size:.95rem;
}
.ig__stats{
  display:flex;justify-content:center;gap:2rem;
  list-style:none;margin:0;padding:0;
}
.ig__stats li{font-size:.92rem;color:var(--texte-sec)}
.ig__stats strong{color:var(--texte);font-weight:800}
.ig__bio{display:flex;flex-direction:column;align-items:center;gap:.15rem}
.ig__name{font-weight:800;font-size:.95rem;color:var(--texte)}
.ig__biotext{margin:0;font-size:.9rem;color:var(--texte);line-height:1.5}
.ig__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.5rem;
}
.ig-post,
.ig-add{
  aspect-ratio:3/4;
  border-radius:8px;
  overflow:hidden;
}
.ig-post{
  position:relative;
  background:var(--gris-bg);
}
.ig-post img{width:100%;height:100%;object-fit:cover;display:block}
.ig-post--empty{
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--gris-bord);
}
.ig-post--empty svg{width:34px;height:34px;stroke:var(--gris-bord)}
.ig-post__del{
  position:absolute;top:6px;right:6px;
  width:30px;height:30px;
  display:flex;align-items:center;justify-content:center;
  border:none;border-radius:8px;
  background:rgba(0,0,0,.6);color:#fff;
  cursor:pointer;
  opacity:0;
  transition:opacity .12s var(--ease),background .12s var(--ease);
}
.ig-post__del svg{width:15px;height:15px}
.ig-post:hover .ig-post__del{opacity:1}
.ig-post__del:hover{background:#C2362F}
.ig-add{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.5rem;
  border:2px dashed var(--gris-bord);
  background:var(--blanc);
  color:var(--texte-sec);
  font-size:.9rem;font-weight:700;font-family:inherit;
  cursor:pointer;
  transition:border-color .15s var(--ease),color .15s var(--ease),background .15s var(--ease);
}
.ig-add:hover{border-color:var(--bleu);color:var(--bleu);background:var(--gris-bg)}
.ig-add svg{width:30px;height:30px}
.ig-locked{
  text-align:center;
  padding:3rem 1.5rem;
  border:1px dashed var(--gris-bord);
  border-radius:14px;
  background:var(--gris-bg);
}
.ig-locked svg{width:46px;height:46px;stroke:var(--gris-bord);margin-bottom:.9rem}
.ig-locked h3{margin:0 0 .4rem;font-size:1.15rem;font-weight:800;color:var(--texte)}
.ig-locked p{
  margin:0 auto 1.2rem;max-width:420px;
  font-size:.95rem;color:var(--texte-sec);line-height:1.5;
}
.ig-locked__btn{
  padding:.65rem 1.3rem;
  border:none;border-radius:8px;
  background:var(--bleu);color:#fff;
  font-size:.9rem;font-weight:800;font-family:inherit;
  cursor:pointer;
  transition:background .14s var(--ease);
}
.ig-locked__btn:hover{background:#00468a}
@media (max-width:560px){
  .ig__avatar{width:96px;height:96px}
}
/* conteneur de la page profil createur dediee */
.inspo-page{
  max-width:935px;
  margin:1.5rem auto 3rem;
  padding:0 clamp(1rem,4vw,2rem);
}
/* carte-bouton "My #SKRLinspo profile" dans My Account */
.ig-link{
  display:flex;align-items:center;gap:1rem;
  padding:1.1rem 1.3rem;
  border:1px solid var(--gris-bord);
  border-radius:12px;
  background:var(--blanc);
  text-decoration:none;
  transition:border-color .15s var(--ease),box-shadow .15s var(--ease);
}
.ig-link:hover{border-color:var(--bleu);box-shadow:0 3px 14px rgba(0,0,0,.08)}
.ig-link__icon{
  flex:none;
  width:44px;height:44px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:var(--gris-bg);color:var(--bleu);
}
.ig-link__icon svg{width:22px;height:22px}
.ig-link__text{flex:1;min-width:0;display:flex;flex-direction:column;gap:.15rem}
.ig-link__text strong{font-size:1rem;font-weight:800;color:var(--texte)}
.ig-link__text span{font-size:.88rem;color:var(--texte-sec)}
.ig-link__badge{
  flex:none;
  padding:.28rem .65rem;
  background:#C2362F;color:#fff;
  font-size:.74rem;font-weight:800;
  border-radius:999px;white-space:nowrap;
}
.ig-link__arrow{width:20px;height:20px;flex:none;color:var(--texte-sec);transition:color .15s var(--ease)}
.ig-link:hover .ig-link__arrow{color:var(--bleu)}


/* ===== PAGE GUIDES - style IKEA ===== */

/* Breadcrumb (deja existant dans accueil.css, mais on s assure) */
.breadcrumb{
  max-width:1280px;margin:0 auto;
  padding:1.2rem clamp(1rem,4vw,2.5rem) 0;
  display:flex;align-items:center;gap:.4rem;
  font-size:.88rem;color:var(--texte-sec);
}
.breadcrumb a{color:var(--texte-sec);text-decoration:none;transition:color .15s var(--ease)}
.breadcrumb a:hover{color:var(--texte)}
.breadcrumb span{color:var(--texte);font-weight:600}
.breadcrumb svg{color:var(--gris-bord)}

/* Hero de la page */
.guides-hero{
  max-width:1280px;margin:0 auto;
  padding:1.5rem clamp(1rem,4vw,2.5rem) 2rem;
}
.guides-hero__title{
  font-size:clamp(2rem,4.5vw,3rem);
  font-weight:800;
  color:var(--texte);
  margin:0 0 .6rem;
  letter-spacing:-.02em;
  line-height:1.1;
}
.guides-hero__sub{
  font-size:clamp(1rem,1.4vw,1.15rem);
  color:var(--texte-sec);
  margin:0;max-width:680px;
  line-height:1.5;
}

/* Tabs (style IKEA : boutons avec bordure rectangulaire) */
.guides-tabs{
  position:sticky;top:80px;background:var(--blanc);z-index:50;
}
.guides-tabs__inner{
  max-width:1280px;margin:0 auto;
  padding:1rem clamp(1rem,4vw,2.5rem);
  display:flex;gap:.6rem;
  overflow-x:auto;
  scrollbar-width:none;
}
.guides-tabs__inner::-webkit-scrollbar{display:none}

.guides-tab{
  flex:0 0 auto;
  background:var(--blanc);
  border:1px solid var(--gris-bord);
  border-radius:6px;
  cursor:pointer;
  padding:.85rem 1.3rem;
  font-size:.95rem;font-weight:500;
  color:var(--texte);
  white-space:nowrap;
  font-family:inherit;
  transition:border-color .15s var(--ease),background .15s var(--ease);
}
.guides-tab:hover{
  border-color:var(--texte);
}
.guides-tab.is-active{
  border-color:var(--texte);
  border-width:2px;
  padding:calc(.85rem - 1px) calc(1.3rem - 1px); /* compense l'epaisseur */
  font-weight:600;
}

/* Contenu des panels */
.guides-content{
  max-width:1280px;margin:0 auto;
  padding:2rem clamp(1rem,4vw,2.5rem) 3rem;
}
.guides-panel{display:none}
.guides-panel.is-active{display:block;animation:fadeInGuide .4s var(--ease)}

@keyframes fadeInGuide{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}

/* Mega menu style IKEA : 3-4 colonnes de liens + image promo a droite */
.guides-mega{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 280px;
  gap:2rem;
  align-items:start;
}
.guides-mega__col{
  display:flex;flex-direction:column;gap:.6rem;
}
.guides-mega__heading{
  font-size:1rem;font-weight:700;
  color:var(--texte);
  margin:0 0 .4rem;
}
.guides-mega__list{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:.5rem;
}
.guides-mega__list a{
  color:var(--texte);
  text-decoration:none;
  font-size:.95rem;
  line-height:1.4;
  transition:color .15s var(--ease);
  display:inline-block;
}
.guides-mega__list a:hover{
  color:var(--bleu);
  text-decoration:underline;
  text-underline-offset:2px;
}

/* Image promo a droite (style IKEA orange/sombre) */
.guides-mega__promo{
  background:#FF6900;
  color:#fff;
  border-radius:8px;
  padding:1.4rem;
  text-decoration:none;
  display:flex;align-items:flex-end;
  min-height:200px;
  transition:transform .25s var(--ease),background .15s var(--ease);
  position:relative;
  overflow:hidden;
}
.guides-mega__promo:hover{
  background:#e55c00;
  transform:translateY(-3px);
}
.guides-mega__promo-text h3{
  font-size:1.4rem;font-weight:700;
  margin:0 0 .4rem;
  text-decoration:underline;
  text-underline-offset:3px;
  line-height:1.2;
}
.guides-mega__promo-text p{
  font-size:.92rem;margin:0;
  opacity:.95;line-height:1.4;
}

/* Mobile : passer en colonne unique */
@media (max-width:980px){
  .guides-mega{
    grid-template-columns:1fr 1fr;
    gap:2rem;
  }
  .guides-mega__promo{grid-column:span 2;min-height:180px}
}
@media (max-width:600px){
  .guides-mega{grid-template-columns:1fr;gap:1.6rem}
  .guides-mega__promo{grid-column:span 1}
}

/* Etat vide (FAQ coming soon) */
.guides-empty{
  display:flex;flex-direction:column;align-items:center;
  text-align:center;
  padding:4rem 2rem;
  color:var(--texte-sec);
}
.guides-empty svg{
  width:64px;height:64px;
  color:var(--gris-bord);
  margin-bottom:1.2rem;
}
.guides-empty h3{
  font-size:1.3rem;font-weight:700;
  color:var(--texte);margin:0 0 .6rem;
}
.guides-empty p{
  font-size:1rem;margin:0;
  max-width:420px;line-height:1.5;
}

/* Mobile */
@media (max-width:760px){
  .guides-tabs{top:60px}
  .guides-tab{padding:.85rem 1rem;font-size:.92rem}
  .guides-tab.is-active::after{left:1rem;right:1rem}
  .guides-grid{grid-template-columns:1fr}
  .guide-card{padding:1.4rem}
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce){
  .guides-panel.is-active{animation:none}
  .guide-card,.guide-card__link svg{transition:none}
}


/* =====================================================
   GUIDES HUB - IKEA customer service style
   Head + 2 big cards + FAQ accordion + contact CTA
   ===================================================== */

/* HEAD (titre + sous-titre, sans search, plus simple) */
.ghub-head{
  background:var(--blanc);
  border-bottom:1px solid var(--gris-bord);
}
.ghub-head__inner{
  max-width:1280px;margin:0 auto;
  padding:3.5rem clamp(1rem,4vw,2.5rem) 2.5rem;
}
.ghub-head__title{
  font-size:clamp(2rem,4vw,2.8rem);
  font-weight:800;
  color:var(--texte);
  margin:0 0 .6rem;
  letter-spacing:-.02em;
  line-height:1.15;
}
.ghub-head__sub{
  font-size:clamp(1rem,1.3vw,1.1rem);
  color:var(--texte-sec);
  margin:0;max-width:640px;
  line-height:1.5;
}

/* 2 BIG CATEGORY CARDS */
.ghub-cats{
  background:var(--blanc);
}
.ghub-cats__inner{
  max-width:1280px;margin:0 auto;
  padding:2.5rem clamp(1rem,4vw,2.5rem) 3.5rem;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.5rem;
}
.ghub-card{
  display:flex;
  align-items:stretch;
  background:var(--blanc);
  border:1px solid var(--gris-bord);
  border-radius:12px;
  overflow:hidden;
  text-decoration:none;
  color:var(--texte);
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease);
  min-height:220px;
}
.ghub-card:hover{
  transform:translateY(-3px);
  border-color:var(--texte);
  box-shadow:0 12px 28px -14px rgba(0,0,0,.2);
}
.ghub-card__media{
  flex:0 0 200px;
  background:var(--gris-bg);
  display:flex;align-items:center;justify-content:center;
  color:var(--bleu);
  transition:background .2s var(--ease);
}
.ghub-card:hover .ghub-card__media{
  background:#E8F1F8;
}
.ghub-card__media svg{
  width:88px;height:88px;
}
.ghub-card__body{
  flex:1;
  display:flex;flex-direction:column;
  padding:1.75rem;
}
.ghub-card__title{
  font-size:1.35rem;font-weight:700;
  margin:0 0 .5rem;
  color:var(--texte);
  letter-spacing:-.01em;
}
.ghub-card__desc{
  font-size:.98rem;
  color:var(--texte-sec);
  margin:0 0 1.4rem;
  line-height:1.5;
  flex:1;
}
.ghub-card__cta{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.95rem;font-weight:600;
  color:var(--bleu);
}
.ghub-card__cta svg{
  width:16px;height:16px;
  transition:transform .2s var(--ease);
}
.ghub-card:hover .ghub-card__cta svg{
  transform:translateX(4px);
}

/* FLOATING QUESTION MARKS (ambient background animation) */
.floating-q{
  position:fixed;
  inset:0;
  pointer-events:none;
  overflow:hidden;
  z-index:0;
}
.floating-q span{
  position:absolute;
  bottom:-12vh;
  left:var(--x);
  font-size:var(--size,80px);
  font-weight:800;
  color:var(--bleu);
  opacity:0;
  font-family:inherit;
  line-height:1;
  user-select:none;
  animation:floatQ var(--dur,22s) linear infinite;
  animation-delay:var(--delay,0s);
  will-change:transform,opacity;
}
@keyframes floatQ{
  0%{
    transform:translateY(0) translateX(0) rotate(-8deg) scale(1);
    opacity:0;
  }
  12%{
    opacity:.16;
  }
  55%{
    transform:translateY(-70vh) translateX(30px) rotate(6deg) scale(1);
    opacity:.16;
  }
  80%{
    opacity:.08;
  }
  100%{
    transform:translateY(-115vh) translateX(-25px) rotate(-14deg) scale(.55);
    opacity:0;
  }
}
@media (prefers-reduced-motion:reduce){
  .floating-q{display:none}
}

/* Content above the floating marks */
main > section{position:relative;z-index:1}


/* ===== GUIDES HUB : layout content + sidebar onglets ===== */
.ghub-layout{
  position:relative;z-index:1;
  max-width:1200px;margin:0 auto;
  padding:0 clamp(1rem,3vw,2rem);
  display:grid;
  grid-template-columns:1fr 240px;
  gap:2rem;
  align-items:start;
}
.ghub-content{min-width:0}
.ghub-content .ghub-faq{
  background:transparent;
  border:none;
}
.ghub-content .ghub-faq__inner{
  padding:0 0 2.5rem;
  max-width:none;
}
.ghub-content .ghub-answers__inner{
  padding:0 0 2.5rem;
  max-width:none;
}
.ghub-content .refs-hero{
  padding:2rem 0 1.4rem;
}
.ghub-content .refs-hero--sub{
  padding:2.4rem 0 1.4rem;
  border-top:1px solid var(--gris-bord);
  margin-top:2rem;
}
.ghub-content .ghub-section:first-child .refs-hero--sub:first-child{
  border-top:none;margin-top:0;
}
.ghub-section[hidden]{display:none}

.ghub-sidebar{
  position:sticky;top:1rem;
  align-self:start;
}
.ghub-tabs{
  display:flex;flex-direction:column;gap:.35rem;
  background:#fff;
  border:1px solid var(--gris-bord);
  border-radius:14px;
  padding:.6rem;
  box-shadow:0 4px 14px rgba(0,0,0,.05);
}
.ghub-tab{
  display:flex;align-items:center;gap:.6rem;
  border:none;background:transparent;cursor:pointer;
  font-family:inherit;font-weight:700;font-size:.92rem;
  padding:.65rem .8rem;border-radius:9px;
  color:var(--texte-sec);
  text-align:left;
  transition:background .14s var(--ease),color .14s var(--ease);
}
.ghub-tab:hover{background:rgba(0,0,0,.04);color:var(--texte)}
.ghub-tab.is-active{background:var(--bleu);color:#fff}
.ghub-tab svg{width:16px;height:16px;flex:none}

@media (max-width:860px){
  .ghub-layout{
    grid-template-columns:1fr;
  }
  .ghub-sidebar{
    position:relative;top:0;order:-1;margin-bottom:.8rem;
  }
  .ghub-tabs{flex-direction:row;flex-wrap:wrap}
  .ghub-tab{flex:1;justify-content:center;min-width:0}
  .ghub-tab span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}


/* FAQ ACCORDION */
.ghub-faq{
  background:var(--gris-bg);
  border-top:1px solid var(--gris-bord);
  border-bottom:1px solid var(--gris-bord);
}
.ghub-faq__inner{
  max-width:880px;margin:0 auto;
  padding:4rem clamp(1rem,4vw,2.5rem) 6.5rem;
}
.ghub-faq__head{
  margin:0 0 2rem;
}
.ghub-faq__title{
  font-size:clamp(1.5rem,2.5vw,2rem);
  font-weight:800;
  color:var(--texte);
  margin:0 0 .5rem;
  letter-spacing:-.01em;
}
.ghub-faq__sub{
  font-size:1rem;
  color:var(--texte-sec);
  margin:0;
}
.ghub-faq__list{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:.6rem;
}
.ghub-faq__item{
  background:var(--blanc);
  border:1px solid var(--gris-bord);
  border-radius:10px;
  overflow:hidden;
  transition:border-color .15s var(--ease);
}
.ghub-faq__item:hover{
  border-color:var(--texte);
}
.ghub-faq__q{
  width:100%;
  background:none;border:none;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.15rem 1.4rem;
  font-family:inherit;
  font-size:1rem;font-weight:600;
  color:var(--texte);
  cursor:pointer;
  text-align:left;
  line-height:1.4;
}
.ghub-faq__chev{
  flex:0 0 auto;
  width:18px;height:18px;
  color:var(--texte-sec);
  transition:transform .25s var(--ease);
}
.ghub-faq__item.is-open .ghub-faq__chev{
  transform:rotate(180deg);
  color:var(--bleu);
}
.ghub-faq__a{
  max-height:0;
  overflow:hidden;
  transition:max-height .3s var(--ease);
}
.ghub-faq__item.is-open .ghub-faq__a{
  max-height:1000px;
}
.ghub-faq__a p{
  padding:0 1.4rem 1.3rem;
  margin:0;
  font-size:.95rem;
  color:var(--texte-sec);
  line-height:1.6;
}
.ghub-faq__a code{
  background:var(--gris-bg);
  border:1px solid var(--gris-bord);
  border-radius:4px;
  padding:.1rem .35rem;
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:.85rem;
  color:var(--texte);
}
.ghub-codeblock{
  position:relative;
  margin:0 1.4rem 1.3rem;
}
.ghub-faq__a pre{
  margin:0;
  background:#1b1b1b;
  border-radius:8px;
  padding:1rem 1.1rem;
  overflow-x:auto;
}
.ghub-faq__a pre code{
  display:block;
  background:none;
  border:0;
  padding:0;
  color:#eaeaea;
  font-size:.8rem;
  line-height:1.7;
  white-space:pre;
}
.ghub-copy{
  position:absolute;
  top:.6rem;right:.6rem;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.22);
  color:#eaeaea;
  font-family:inherit;
  font-size:.76rem;font-weight:600;
  padding:.35rem .7rem;
  border-radius:6px;
  cursor:pointer;
  transition:background .15s var(--ease),border-color .15s var(--ease);
}
.ghub-copy:hover{background:rgba(255,255,255,.2)}
.ghub-copy.is-copied{
  background:var(--bleu);
  border-color:var(--bleu);
  color:#fff;
}
.ghub-faq__a a{
  color:var(--bleu);
  text-decoration:underline;
  text-underline-offset:2px;
}

/* ANSWERS GRID (IKEA customer service style) */
.ghub-answers{
  background:var(--gris-bg);
}
.ghub-answers__inner{
  max-width:none;margin:0;
  padding:1rem 0 3.5rem;
}
.ghub-answers__panel{
  background:transparent;
  padding:0;
}
.ghub-answers__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--gris-bord);
  overflow:hidden;
}
.ghub-ans{
  background:var(--gris-bg);
  padding:1.8rem 1.4rem;
  text-align:center;
  display:flex;flex-direction:column;align-items:center;
  transition:background .15s var(--ease);
}
.ghub-ans:hover{
  background:var(--blanc);
}
.ghub-ans__icon{
  width:36px;height:36px;
  display:flex;align-items:center;justify-content:center;
  color:var(--texte);
  margin-bottom:.9rem;
}
.ghub-ans__icon svg{width:32px;height:32px}
.ghub-ans__title{
  font-size:1.05rem;
  font-weight:700;
  color:var(--texte);
  margin:0 0 .45rem;
}
.ghub-ans__desc{
  font-size:.92rem;
  color:var(--texte-sec);
  margin:0 0 .9rem;
  line-height:1.5;
  flex:1;
  max-width:240px;
}
.ghub-ans__link{
  font-size:.92rem;
  color:var(--texte);
  text-decoration:underline;
  text-underline-offset:3px;
  transition:color .15s var(--ease);
}
.ghub-ans__link:hover{
  color:var(--bleu);
}

@media (max-width:980px){
  .ghub-answers__grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:560px){
  .ghub-answers__grid{grid-template-columns:1fr}
  .ghub-ans{padding:1.5rem 1.2rem}
}


/* CONTACT CTA */
.ghub-cta{
  background:var(--bleu);
  color:var(--blanc);
}
.ghub-cta__inner{
  max-width:1280px;margin:0 auto;
  padding:3rem clamp(1rem,4vw,2.5rem);
  display:flex;align-items:center;justify-content:space-between;gap:2rem;
  flex-wrap:wrap;
}
.ghub-cta__text h2{
  font-size:clamp(1.5rem,2.5vw,1.9rem);
  font-weight:800;
  margin:0 0 .4rem;
  letter-spacing:-.01em;
}
.ghub-cta__text p{
  font-size:1rem;
  margin:0;
  opacity:.9;
  max-width:560px;
}
.ghub-cta__btn{
  background:var(--jaune);
  color:var(--texte);
  text-decoration:none;
  padding:.95rem 1.6rem;
  border-radius:8px;
  font-weight:700;
  font-size:.95rem;
  white-space:nowrap;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease);
}
.ghub-cta__btn:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 18px -8px rgba(0,0,0,.3);
}

/* RESPONSIVE */
@media (max-width:780px){
  .ghub-cats__inner{grid-template-columns:1fr}
  .ghub-card{flex-direction:column;min-height:auto}
  .ghub-card__media{flex:0 0 auto;padding:2.2rem 0}
}
@media (max-width:600px){
  .ghub-head__inner{padding:2.5rem clamp(1rem,4vw,2.5rem) 2rem}
  .ghub-cats__inner{padding:2rem clamp(1rem,4vw,2.5rem) 2.5rem}
  .ghub-faq__inner{padding:3rem clamp(1rem,4vw,2.5rem)}
  .ghub-cta__inner{flex-direction:column;align-items:flex-start;text-align:left;padding:2.5rem clamp(1rem,4vw,2.5rem)}
}

/* ===================================================================
   TABS Guides / Tips (sous breadcrumb, au-dessus du hero)
   =================================================================== */
.help-tabs{
  position:relative;
  display:flex;flex-direction:row;justify-content:center;gap:.3rem;
  max-width:880px;margin:1.4rem auto 0;
  padding:0 clamp(1rem,4vw,2.5rem);
  background:transparent;border:none;border-radius:0;box-shadow:none;
  border-bottom:1px solid var(--gris-bord);
}
.help-tab{
  position:relative;
  flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  border:none;background:none;cursor:pointer;
  padding:.95rem 1.6rem;margin-bottom:-1px;
  font-family:inherit;font-size:.98rem;font-weight:700;
  color:var(--texte-sec);
  letter-spacing:.01em;
  transition:color .15s var(--ease);
}
.help-tab:hover{color:var(--texte);background:none}
.help-tab::after{
  content:'';
  position:absolute;left:1rem;right:1rem;bottom:0;
  height:3px;border-radius:2px 2px 0 0;
  background:var(--bleu);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .2s var(--ease);
}
.help-tab.is-active{color:var(--texte);background:none}
.help-tab.is-active::after{transform:scaleX(1)}
.help-tab:focus-visible{outline:2px solid var(--bleu);outline-offset:3px;border-radius:6px}
.help-tabpane[hidden]{display:none}
@media (max-width:560px){
  .help-tabs{gap:0;padding:0 .8rem}
  .help-tab{padding:.8rem .9rem;font-size:.9rem}
  .help-tab::after{left:.6rem;right:.6rem}
}

/* =====================================================================
   Furniture tab - refonte flat + fusion visuelle des cartes (Skrl3D, B6).
   Place ici (guides.css, charge par toutes les pages categorie) avec une
   specificite > inline (.pack-modal__card ...) pour restyler les 10 packs
   depuis une seule source, sans toucher au markup ni au JS des popups.
   ===================================================================== */
.pack-modal__card .pack-modal__furn{
  background:var(--blanc, #fff) !important;
  border:1px solid var(--gris-bord, #e6e6e6) !important;
  border-radius:12px !important;
  box-shadow:none !important;
  padding:.95rem 1.05rem !important;
  margin:0 !important;
  display:flex;flex-direction:column;gap:0;
}
.pack-modal__card .pack-modal__furn--locked{
  background:var(--blanc, #fff) !important;
  border:1px solid var(--gris-bord, #e6e6e6) !important;
}
.pack-modal__card .pack-modal__furn--locked::before{display:none !important}
/* 2 cartes qui se suivent (bigpack : export + images ZIP) -> BIEN SEPAREES :
   chacune garde ses 4 coins arrondis + bordure complete, espace net entre les deux. */
.pack-modal__card .pack-modal__furn:has(+ .pack-modal__furn){
  border-radius:12px !important;
  border-bottom:1px solid var(--gris-bord, #e6e6e6) !important;
}
.pack-modal__card .pack-modal__furn + .pack-modal__furn{
  margin-top:.8rem !important;
  border-radius:12px !important;
  border-top:1px solid var(--gris-bord, #e6e6e6) !important;
}
/* Contenu : titres, badges, hints, boutons -> flat */
.pack-modal__card .pack-modal__furn-head{
  display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  margin-bottom:.45rem;flex-wrap:wrap;
}
.pack-modal__card .pack-modal__furn-title{
  font-size:.78rem;font-weight:800;letter-spacing:.04em;
  text-transform:uppercase;color:var(--texte);
}
.pack-modal__card .pack-modal__furn-badge{
  background:rgba(35,165,90,.12) !important;color:#1e8f4e !important;
  box-shadow:none !important;
  font-size:.62rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  padding:.24rem .5rem;border-radius:7px;
}
.pack-modal__card .pack-modal__furn-badge--lock{
  background:#fbeaea !important;color:#b3261e !important;box-shadow:none !important;
}
.pack-modal__card .pack-modal__furn-hint,
.pack-modal__card .pack-modal__furn-empty-msg{
  margin:0;font-size:.82rem;line-height:1.5;color:var(--texte-sec);
}
.pack-modal__card .pack-modal__furn-link{
  color:var(--pack-accent, #a67c1f);font-weight:700;
  text-decoration:underline;text-underline-offset:2px;filter:none;
}
.pack-modal__card .pack-modal__furn-row{
  display:flex;align-items:center;gap:.55rem;margin:.55rem 0 0;
  border:0 !important;padding:0 !important;
}
.pack-modal__card .pack-modal__furn-setup-btn{
  display:inline-flex;align-items:center;gap:.35rem;margin-top:.65rem;
  padding:.5rem .9rem;border-radius:8px;
  border:0 !important;cursor:pointer;
  background:var(--pack-accent, #a67c1f) !important;color:#fff !important;
  box-shadow:none !important;transform:none !important;
  font-size:.82rem;font-weight:700;text-decoration:none;
}
.pack-modal__card .pack-modal__furn-copy{
  box-shadow:none !important;border-radius:8px;
}
/* Pas de contour noir au clic (focus souris) ; ring discret au clavier (a11y) */
.pack-modal__card .pack-modal__furn-setup-btn:focus,
.pack-modal__card .furn-active__copy:focus,
.pack-modal__card .furn-active__dl:focus{ outline:none; }
.pack-modal__card .pack-modal__furn-setup-btn:focus-visible,
.pack-modal__card .furn-active__copy:focus-visible,
.pack-modal__card .furn-active__dl:focus-visible{ outline:2px solid var(--pack-accent,#a67c1f); outline-offset:2px; }
/* ===================== fin refonte Furniture tab ===================== */
/* Furniture tab : la carte remplit la hauteur de la colonne (bas aligne sur
   le bouton Add to cart), alignee en haut -> plus de blanc nu, panneau propre
   coherent avec la colonne 3D de droite. Sur les 10 pages. */
.pack-modal__card .pack-modal__pane[data-pane="furn"]{
  justify-content:flex-start;
  overflow-y:auto;
  padding-bottom:.4rem;
}
.pack-modal__card .pack-modal__pane[data-pane="furn"] > .pack-modal__furn:last-child{
  flex:0 0 auto;
}

/* ============= Furniture tab : lock minimal + teaser floute (mix) =============
   Le vrai furniture.lua est devine en flou en fond ; par-dessus, un lock
   centre epure (cadenas + titre + bouton). Remplit la hauteur de la colonne. */
.pack-modal__card .furn-tease{
  position:relative;overflow:hidden;padding:0 !important;min-height:340px;
}
.pack-modal__card .furn-tease__code{
  position:absolute;inset:0;padding:1.1rem 1.2rem;
  font:600 .78rem/1.7 ui-monospace,Menlo,Consolas,monospace;color:#9aa0aa;
  filter:blur(3px);user-select:none;pointer-events:none;
  -webkit-mask-image:linear-gradient(#000 26%,transparent 92%);
          mask-image:linear-gradient(#000 26%,transparent 92%);
}
.pack-modal__card .furn-tease__code .k{color:#b388c9}
.pack-modal__card .furn-tease__code .s{color:#9a9f63}
.pack-modal__card .furn-tease__ovl{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;gap:.5rem;padding:1.5rem;
  background:radial-gradient(circle at 50% 42%, rgba(255,255,255,.80), rgba(255,255,255,.95));
}
.pack-modal__card .furn-tease__lk{
  width:48px;height:48px;border-radius:50%;margin-bottom:.2rem;
  background:color-mix(in srgb, var(--pack-accent, #bf3326) 14%, #fff);
  color:var(--pack-accent, #bf3326);display:flex;align-items:center;justify-content:center;
}
.pack-modal__card .furn-tease__tag{
  font:800 .64rem system-ui;letter-spacing:.08em;text-transform:uppercase;
  color:var(--pack-accent, #bf3326);
}
.pack-modal__card .furn-tease__t1{margin:0;font-weight:800;font-size:1.12rem;color:var(--texte)}
.pack-modal__card .furn-tease__t2{margin:0;font-size:.84rem;line-height:1.5;color:var(--texte-sec);max-width:30ch}
.pack-modal__card .furn-tease__cta{
  margin-top:.55rem;display:inline-flex;align-items:center;gap:.45rem;
  padding:.62rem 1.1rem;border-radius:9px;
  background:var(--pack-accent, #bf3326);color:#fff;font:800 .84rem system-ui;text-decoration:none;
}
.pack-modal__card .furn-tease__cta:hover{filter:brightness(1.06)}
/* =========== fin Furniture tab : lock minimal + teaser floute =========== */
/* Onglet Furniture : le Copy/CTA vit DANS la carte (teaser verrouille, apercu
   client actif, ou "go to profile" vide) -> le bouton bas fait toujours doublon
   sur cet onglet, on le masque. Les autres onglets (Add to cart) ne sont pas touches. */
.pack-modal__card:has(.pack-modal__tab[data-tab="furn"].is-active) .pack-modal__btn--addcart{
  display:none !important;
}

/* ============= Furniture tab : etat CLIENT ACTIF (apercu reel + copy) =============
   Quand le client a un housing defini, on montre un apercu fidele du
   furniture.lua (genere par FURN_GENERATORS, donc identique a la copie),
   fondu en bas, avec un badge compteur de props et un bouton Copy integre.
   Couleur via --pack-accent (theme du pack). Injecte par furn-tease.js. */
.pack-modal__card .furn-active__wrap{
  position:relative;flex:1 1 auto;min-height:0;margin:.7rem 0 0;display:flex;flex-direction:column;
}
.pack-modal__card .furn-active__count{
  position:absolute;top:.5rem;right:.5rem;z-index:2;
  font:800 .62rem system-ui;letter-spacing:.02em;color:#fff;
  background:var(--pack-accent, #a67c1f);padding:.2rem .55rem;border-radius:999px;
}
.pack-modal__card .furn-active__code{
  flex:1 1 auto;min-height:90px;margin:0;overflow:hidden;
  background:#faf8f3;border:1px solid var(--gris-bord, #eee);border-radius:10px;
  padding:.55rem .65rem;font:600 .6rem/1.5 ui-monospace,Menlo,Consolas,monospace;
  color:#6b7280;white-space:pre;
  -webkit-mask-image:linear-gradient(#000 58%,transparent 94%);
          mask-image:linear-gradient(#000 58%,transparent 94%);
}
.pack-modal__card .furn-active__copy{
  margin-top:.7rem;display:flex;align-items:center;justify-content:center;gap:.45rem;
  width:100%;padding:.72rem;border-radius:10px;border:0;cursor:pointer;
  background:var(--pack-accent, #a67c1f);color:#fff;font:800 .84rem system-ui;
}
.pack-modal__card .furn-active__copy:hover{filter:brightness(1.06)}
.pack-modal__card .furn-active__copy.is-ok{background:#1e8f4e}
/* =========== fin Furniture tab : etat client actif =========== */
/* Onglet Furniture : une carte teaser (verrouille OU vide) remplit la hauteur
   du volet ; une carte suivante eventuelle (ex. bigpack "Pack images ZIP")
   garde sa taille naturelle au lieu de s'etirer et laisser du blanc. */
.pack-modal__card .pack-modal__pane[data-pane="furn"] > .pack-modal__furn.furn-tease{
  flex:1 1 auto;
}
.pack-modal__card .pack-modal__pane[data-pane="furn"] > .pack-modal__furn.furn-tease ~ .pack-modal__furn{
  flex:0 0 auto;
}
/* Onglet Furniture : rangee d'actions (Copy + Download .lua cote a cote).
   Le Copy reste principal (accent, flex:1), le Download est secondaire (outline). */
.pack-modal__card .furn-active__actions{ display:flex; gap:.5rem; margin-top:.7rem; }
.pack-modal__card .furn-active__actions .furn-active__copy{ margin-top:0; flex:1 1 auto; width:auto; }
.pack-modal__card .furn-active__dl{
  flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  padding:.72rem 1rem; border-radius:10px; cursor:pointer;
  background:#fff; color:var(--pack-accent, #a67c1f);
  border:1px solid color-mix(in srgb, var(--pack-accent, #a67c1f) 38%, #fff);
  font:800 .82rem system-ui;
}
.pack-modal__card .furn-active__dl:hover{ background:color-mix(in srgb, var(--pack-accent, #a67c1f) 8%, #fff); }
.pack-modal__card .furn-active__dl svg{ flex:none; }