/* Compte partagé KIS, présentation Delight ; aucun panneau d’administration. */
.compte-kis{max-width:46rem;margin:0 auto;padding:calc(var(--entete-h,68px) + env(safe-area-inset-top) + 1.25rem) 1.25rem 4rem}
.compte-kis h1{font-size:clamp(2rem,6vw,4rem);line-height:1.06;margin:.5em 0}
.compte-kis__intro{max-width:38rem;line-height:1.65;color:var(--c-texte-doux,#aaa)}
.compte-kis__carte{border:1px solid var(--c-bordure,#555);padding:clamp(1rem,3vw,2rem);margin-top:1.5rem;border-radius:1rem}
.compte-kis__choix{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1.5rem}
.compte-kis button{font:inherit;cursor:pointer;min-height:44px;border:1px solid var(--c-bordure,#777);background:transparent;color:inherit;border-radius:.45rem;padding:.7rem 1rem}
.compte-kis button[aria-pressed=true],.compte-kis button[type=submit]{background:var(--c-accent,#d8ff3e);color:var(--bouton-texte,#111);border-color:var(--c-accent,#d8ff3e);font-weight:700}
.compte-kis button:disabled{cursor:default;opacity:.48}
.compte-kis form{display:grid;gap:1.1rem}
.compte-kis label{display:grid;gap:.4rem;font-weight:600}
.compte-kis input{font:inherit;font-size:16px;width:100%;min-width:0;min-height:48px;border:1px solid var(--c-bordure,#777);border-radius:.4rem;background:var(--c-fond,#101010);color:var(--c-texte,#fff);padding:.65rem .8rem;box-sizing:border-box}
.compte-kis [hidden]{display:none!important}
html.kis-has-cached-session .compte-kis [data-compte-formulaires]{display:none!important}
html.kis-has-cached-session .compte-kis [data-compte-connecte]{display:block!important}
.compte-kis__message{min-height:1.5em;line-height:1.55;overflow-wrap:anywhere}
.compte-kis__message[data-error=true]{color:#ff8c8c}
.compte-kis__apple{display:block;width:100%;margin-top:1.2rem}
.compte-kis__note{font-size:.9rem;line-height:1.6;color:var(--c-texte-doux,#aaa)}
.compte-kis__email{overflow-wrap:anywhere}
.compte-kis a{text-decoration:underline;text-underline-offset:.2em}
.compte-kis :is(input,button,a):focus-visible{outline:3px solid var(--c-accent,#d8ff3e);outline-offset:3px}
@media(min-width:1180px){.entete .nav__liste{gap:.6rem}.entete .nav__liste a{font-size:.72rem;letter-spacing:.02em}.entete .entete__reserver{display:none}}

.comparaison-modeles[hidden]{display:none!important}

.avatar-kis{border-top:1px solid var(--c-bordure,#666);padding:1.5rem 0;margin:1.5rem 0}.avatar-kis__apercu{width:88px;height:88px;border-radius:50%;border:2px solid var(--c-accent,#d8ff3e);display:grid;place-items:center;font-size:2.8rem;overflow:hidden;margin:1rem 0}.avatar-kis__apercu img{width:100%;height:100%;object-fit:cover}.avatar-kis__icones{display:flex;flex-wrap:nowrap;gap:.45rem;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding:.2rem;padding:.8rem .2rem 1rem;-webkit-overflow-scrolling:touch}.avatar-kis__icones button{flex:0 0 48px;min-width:48px;height:48px;font-size:1.5rem;padding:.4rem;scroll-snap-align:start}.avatar-kis__photo input{width:100%;font-size:.85rem}

.avatar-kis [data-avatar-message][data-error=true]{color:#ff8c8c}

.compte-groupes__groupe{border-left:3px solid var(--c-accent,#d8ff3e);padding:.4rem 1rem;margin:1rem 0}
.compte-groupes__groupe h3{margin:.25rem 0;font-size:1.15rem}
.compte-groupes__groupe p{font-size:.9rem;line-height:1.5;margin:.4rem 0}

/* Espace personnel compact : les actions restent au premier plan. */
.compte-kis{max-width:64rem;padding:calc(var(--entete-h,68px) + env(safe-area-inset-top) + 1rem) 1.25rem 2rem}
.compte-kis>h1{font-size:clamp(1.35rem,2.8vw,1.85rem);line-height:1.15;letter-spacing:.01em;margin:.25rem 0 .6rem}
.compte-kis>.compte-kis__intro:first-child{font-size:.63rem;letter-spacing:.14em;color:#b8c98c;margin:0 0 .3rem}
.compte-kis>.compte-kis__intro{font-size:.8rem;line-height:1.45;margin:.25rem 0 .65rem}
.compte-kis:has([data-compte-connecte]:not([hidden]))>h1{margin-bottom:.75rem}
.compte-kis:has([data-compte-connecte]:not([hidden]))>h1+.compte-kis__intro{display:none}
.compte-kis__carte{padding:clamp(.8rem,2vw,1.15rem);margin-top:.65rem;border:1px solid #7aa8c333;background:linear-gradient(125deg,#7aa8c30b,transparent 60%);border-radius:16px}
.compte-kis [data-compte-connecte]>h2{font-size:1.05rem;line-height:1.3;margin:0 0 .35rem;text-transform:none;letter-spacing:0}
.compte-kis [data-compte-connecte]>.compte-kis__email{font-size:.78rem;color:#9ccaf0;margin:.2rem 0 .35rem}
.compte-kis [data-compte-connecte]>p:not(.compte-kis__email){font-size:.71rem;line-height:1.45;margin:.3rem 0;color:var(--c-texte-doux,#aaa)}
.compte-kis__message:empty,[data-groupes-message]:empty{display:none}
.compte-kis>.compte-kis__note{font-size:.68rem;line-height:1.45;margin:.65rem 0}
.compte-groupes{margin:.6rem 0}
.compte-groupes [data-groupes-liste]{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:.5rem}
.compte-groupes__groupe{margin:0;padding:.65rem .8rem;border:1px solid #db9bc13d;border-left:3px solid #db9bc1;border-radius:11px;background:linear-gradient(115deg,#db9bc112,#8abcf00a);display:flex;align-items:center;flex-wrap:wrap;gap:.35rem .6rem}
.compte-groupes__groupe h3{font-size:.88rem;line-height:1.3;margin:0;color:#ebbad6}
.compte-groupes__groupe>p{font-size:.64rem;margin:0;color:#b6c4cf}
.compte-groupes__membres{flex-basis:100%;display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.15rem}
.compte-groupes__membre{display:flex;align-items:center;flex-wrap:wrap;gap:.3rem;padding:.3rem .5rem;border:1px solid #ffffff12;border-radius:7px;background:#ffffff05;font-size:.74rem;line-height:1.3}
.compte-groupes__role{color:#b6c4cf;font-size:.65rem}
.compte-groupes__badge{color:#edc485;background:#b98a361c;border:1px solid #d4a04e33;border-radius:20px;padding:.12rem .38rem;font-size:.59rem;white-space:nowrap}
.compte-kis [data-compte-deconnexion]{min-height:36px;font-size:.73rem;padding:.4rem .65rem;margin-top:.65rem;color:#c1cad3}
@media(max-width:600px){.compte-kis{padding-right:.8rem;padding-left:.8rem}.compte-kis__carte{border-radius:12px}.compte-kis>h1{font-size:1.4rem}.compte-groupes__groupe{padding:.55rem .65rem}}
.compte-groupes__groupe h3{display:flex;align-items:center;gap:6px}.compte-groupes__avatar{width:24px;height:24px;flex-shrink:0;display:inline-grid;place-items:center;border-radius:7px;overflow:hidden;background:#eab4d217}.compte-groupes__avatar img{width:100%;height:100%;object-fit:cover}

/* Saisie guidée : critères, couleurs et libellés restent lisibles sur iPhone. */
.compte-password{display:grid;gap:.4rem;min-width:0}
.compte-password__row{position:relative;min-width:0}
.compte-password__row input{padding-right:3.25rem}
.compte-kis .compte-password__eye{position:absolute;right:2px;top:2px;width:44px;min-height:44px;height:calc(100% - 4px);padding:0;display:grid;place-items:center;border:0;background:transparent;color:var(--c-texte,#fff);border-radius:.35rem}
.compte-kis .compte-password__eye[aria-pressed=true]{background:#ffffff12;color:var(--c-texte,#fff);border:0}
.compte-password__eye .compte-password__slash{display:none}
.compte-password__eye[aria-pressed=true] .compte-password__slash{display:block}
.compte-password__rules{--password-tone:#ff9191;padding:.55rem .65rem;border:1px solid #ffffff20;border-radius:.5rem;background:#ffffff04}
.compte-password__rules[data-level=orange]{--password-tone:#ffbe69}
.compte-password__rules[data-level=green]{--password-tone:#91ddaf}
.compte-password__bars{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
.compte-password__bars span{height:6px;border-radius:2px;background:#ff919129;border:1px solid #ff919150}
.compte-password__bars span[data-complete=true]{background:var(--password-tone);border-color:var(--password-tone)}
.compte-password__progress{color:var(--password-tone);font-size:.78rem;line-height:1.4;margin:.4rem 0}
.compte-password__criteria{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.3rem .65rem;font-size:.76rem;line-height:1.4;font-weight:400}
.compte-password__criteria li{display:flex;align-items:baseline;gap:.4rem;color:#ffb7b7}
.compte-password__criteria li[data-met=true]{color:#a3dfba}
.compte-password__mark{flex:none;width:1em;text-align:center;font-weight:700}
.compte-password__match{font-size:.76rem;line-height:1.45;color:var(--c-texte-doux,#aaa);margin:.1rem 0 0}
.compte-password__match[data-match=true]{color:#a3dfba}
@media(max-width:360px){.compte-password__criteria{grid-template-columns:1fr}}

.compte-groupes [data-groupes-liste]{display:flex;flex-wrap:wrap;align-items:flex-start;gap:7px}.compte-groupes details.compte-groupes__groupe{display:block;box-sizing:border-box;border:0;padding:0;background:none;border-radius:9px;min-width:0}.compte-groupes__groupe>summary{display:grid;place-items:center;list-style:none;width:40px;height:40px;border:1px solid #db9bc166;border-radius:9px;cursor:pointer;background:#db9bc10d}.compte-groupes__groupe>summary::-webkit-details-marker{display:none}.compte-groupes__groupe>summary .compte-groupes__avatar{width:30px;height:30px;font-size:22px}.compte-groupes__groupe[open]{flex-basis:100%;border:1px solid #db9bc144!important;padding:7px!important;background:#db9bc108!important}.compte-groupes__detail{padding:7px 2px}.compte-groupes__groupe:not([open])>.compte-groupes__detail{display:none}.compte-groupes__groupe>summary:focus-visible{outline:2px solid #d4ff39;outline-offset:2px}.compte-groupes__detail .compte-groupes__membres{margin-top:7px}.compte-groupes__detail>h3{font-size:.9rem}

/* Les pastilles de groupes ne reprennent pas les flèches du volet Profil. */
.compte-kis .compte-groupes details.compte-groupes__groupe>summary{box-sizing:border-box;display:grid;place-items:center;width:44px;min-width:44px;max-width:44px;height:44px;min-height:44px;padding:0;margin:0;gap:0;line-height:1;overflow:hidden}
.compte-kis .compte-groupes details.compte-groupes__groupe>summary::before,.compte-kis .compte-groupes details.compte-groupes__groupe>summary::after{content:none;display:none}
.compte-kis .compte-groupes details.compte-groupes__groupe>summary .compte-groupes__avatar{box-sizing:border-box;display:grid;place-items:center;width:30px;height:30px;margin:0;font-size:24px;line-height:1}
.compte-kis .compte-groupes details.compte-groupes__groupe>.compte-groupes__detail{margin:0;padding:9px 2px}
.compte-kis .compte-groupes [data-groupes-liste]{gap:7px;max-width:100%}
@media(max-width:480px){.compte-kis .espace-perso .avatar-kis{grid-template-columns:56px minmax(0,1fr);gap:8px 10px}.compte-kis .espace-perso .avatar-kis__apercu{box-sizing:border-box;width:54px;height:54px}.compte-kis .espace-perso .avatar-kis__photo{min-width:0;max-width:100%;font-size:12px}.compte-kis .espace-perso .avatar-kis__photo input{box-sizing:border-box;min-width:0;max-width:100%;font-size:12px;padding:6px}}

/* Masquage strict du pied de page du site vitrine sur la page Mon profil / Mon compte */
.page-compte-kis footer,
.page-compte-kis footer.pied,
.page-compte-kis .pied,
body:has(.compte-kis) footer,
body:has(.compte-kis) .pied,
body.structure-pages:has(.compte-kis) footer,
body.structure-pages:has(.compte-kis) .pied,
.compte-kis ~ footer,
.compte-kis ~ .pied {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  overflow: hidden !important;
}

/* === REHAUSSEMENT DESIGN & RESPONSIVE COMPACT ESPACE PROFIL MAC / IPAD (PAYSAGE & PORTRAIT) / IPHONE / WEB === */
html.compte-dans-onglets {
  --entete-h: 0px !important;
}
html.compte-dans-onglets body,
html.compte-dans-onglets main {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
.compte-kis:has([data-compte-connecte]:not([hidden])) {
  width: 100% !important;
  max-width: min(1240px, calc(100vw - 20px)) !important;
  padding-top: calc(var(--entete-h, 0px) + 4px) !important;
  padding-bottom: 10px !important;
  padding-left: clamp(8px, 1.5vw, 18px) !important;
  padding-right: clamp(8px, 1.5vw, 18px) !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}
html.compte-dans-onglets .compte-kis:has([data-compte-connecte]:not([hidden])) {
  padding-top: 4px !important;
}
.compte-kis:has([data-compte-connecte]:not([hidden])) > .compte-kis__carte {
  margin-top: 2px !important;
  padding: clamp(8px, 1.2vh, 14px) clamp(10px, 1.5vw, 18px) !important;
  border-radius: 14px !important;
}
.kis-profil-topbar {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 6px 12px !important;
  margin: 0 0 6px 0 !important;
  padding: 0 2px !important;
}
.compte-kis [data-compte-connecte] > h2,
.kis-profil-topbar > h2 {
  font-size: clamp(1.05rem, 1.8vw, 1.35rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.3px !important;
  background: linear-gradient(90deg, #d4ff39 0%, #38bdf8 55%, #818cf8 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.kis-profil-topbar-right {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-left: auto !important;
}
.kis-profil-topbar-right .compte-kis__email {
  margin: 0 !important;
  font-size: 11.5px !important;
  color: #93c5fd !important;
  background: rgba(56, 189, 248, 0.1) !important;
  border: 1px solid rgba(56, 189, 248, 0.25) !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
}
.compte-kis .espace-perso,
.espace-perso[data-profil-perso],
section.espace-perso {
  background: radial-gradient(130% 130% at 0% 0%, rgba(22, 38, 60, 0.96) 0%, rgba(12, 21, 34, 0.98) 100%) !important;
  border: 1px solid rgba(56, 189, 248, 0.32) !important;
  border-radius: 14px !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45), 0 0 18px rgba(56, 189, 248, 0.1) !important;
  padding: clamp(10px, 1.4vh, 16px) clamp(12px, 1.6vw, 20px) !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* Grille 2 colonnes (Coordonnées à gauche, Identifiant + Groupes à droite) dès 700px (iPad Portrait & Paysage, Mac, Web) */
.espace-perso-colonnes {
  display: grid !important;
  grid-template-columns: minmax(0, 1.55fr) minmax(270px, 1fr) !important;
  gap: clamp(10px, 1.4vw, 18px) !important;
  align-items: start !important;
  width: 100% !important;
}
.espace-perso-col-gauche {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
.espace-perso-col-droite {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.compte-kis .espace-perso > details {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.compte-kis .espace-perso > details > summary {
  display: none !important;
}
.compte-kis .espace-perso form[data-profil-perso-form],
form[data-profil-perso-form] {
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 6px 8px !important;
  align-content: start !important;
  width: 100% !important;
}
.compte-kis .espace-perso .identifiantCompte,
.compte-kis .identifiantCompte {
  margin: 0 !important;
  height: auto !important;
  box-sizing: border-box !important;
  justify-content: flex-start !important;
}
.compte-kis .espace-perso .compte-groupes,
.compte-kis [data-compte-groupes] {
  order: 10 !important;
  width: 100% !important;
  margin: 0 !important;
}

/* Tablette portrait étroite / iPhone (< 700px) */
@media (max-width: 699px) {
  .espace-perso-colonnes {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .compte-kis .espace-perso form[data-profil-perso-form] {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 6px 8px !important;
  }
}

/* === SECTION MES GROUPES (DELIGHT) COMPACTE & ÉLÉGANTE === */
.compte-kis .espace-perso .compte-groupes,
.compte-kis .compte-groupes,
[data-compte-groupes] {
  order: 10 !important;
  width: 100% !important;
  margin: 16px 0 4px 0 !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(236, 72, 153, 0.38) !important;
  background: linear-gradient(145deg, rgba(31, 19, 44, 0.86) 0%, rgba(15, 23, 42, 0.95) 100%) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  box-sizing: border-box !important;
}
.compte-groupes__section-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 0 0 10px 0 !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(236, 72, 153, 0.24) !important;
}
.compte-groupes__section-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font: 800 11.5px/1.2 system-ui, sans-serif !important;
  letter-spacing: 0.05em !important;
  color: #fbcfe8 !important;
}
.compte-groupes__section-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  font: 700 10px/1.2 system-ui !important;
  color: #f9a8d4 !important;
  background: rgba(236, 72, 153, 0.18) !important;
  border: 1px solid rgba(244, 114, 182, 0.4) !important;
}
.compte-groupes__toggle-all {
  appearance: none !important;
  border: 1px solid rgba(244, 114, 182, 0.45) !important;
  background: rgba(236, 72, 153, 0.14) !important;
  color: #fdf2f8 !important;
  font: 700 10.5px/1 system-ui !important;
  padding: 5px 10px !important;
  min-height: 26px !important;
  height: 26px !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  width: auto !important;
  margin: 0 !important;
}
.compte-kis .compte-groupes [data-groupes-liste],
[data-compte-groupes] [data-groupes-liste] {
  display: flex !important;
  flex-direction: column !important;
  gap: 9px !important;
  width: 100% !important;
}
.compte-kis .compte-groupes details.compte-groupes__groupe,
details.compte-groupes__groupe {
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 12px !important;
  border: 1.5px solid rgba(236, 72, 153, 0.38) !important;
  background: linear-gradient(135deg, rgba(46, 20, 48, 0.72) 0%, rgba(17, 24, 42, 0.94) 55%, rgba(14, 31, 52, 0.96) 100%) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  padding: 0 !important;
  overflow: hidden !important;
}
.compte-kis .compte-groupes details.compte-groupes__groupe[open],
details.compte-groupes__groupe[open] {
  padding: 0 !important;
  border: 1.5px solid rgba(236, 72, 153, 0.45) !important;
  background: linear-gradient(135deg, rgba(48, 20, 50, 0.76) 0%, rgba(16, 25, 44, 0.95) 55%, rgba(12, 29, 48, 0.98) 100%) !important;
}
.compte-kis .compte-groupes details.compte-groupes__groupe > summary,
details.compte-groupes__groupe > summary {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 6px 10px !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 38px !important;
  padding: 6px 12px !important;
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(236, 72, 153, 0.22) !important;
  border-radius: 0 !important;
  background: linear-gradient(90deg, rgba(236, 72, 153, 0.16) 0%, rgba(139, 92, 246, 0.12) 50%, rgba(56, 189, 248, 0.08) 100%) !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}
.compte-kis .compte-groupes details.compte-groupes__groupe:not([open]) > summary {
  border-bottom: 0 !important;
}
.compte-kis .compte-groupes details.compte-groupes__groupe > summary h3,
details.compte-groupes__groupe > summary h3 {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.3px !important;
  color: #fce7f3 !important;
}
.compte-kis .compte-groupes details.compte-groupes__groupe > summary .compte-groupes__avatar,
details.compte-groupes__groupe > summary .compte-groupes__avatar {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  border-radius: 7px !important;
  border: 1.5px solid rgba(244, 114, 182, 0.65) !important;
  box-shadow: 0 0 8px rgba(236, 72, 153, 0.35) !important;
}
.compte-groupes__meta {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-left: auto !important;
}
.compte-groupes__visibilite {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  color: #f9a8d4 !important;
  background: rgba(236, 72, 153, 0.16) !important;
  border: 1px solid rgba(244, 114, 182, 0.38) !important;
  margin: 0 !important;
}
.compte-groupes__compteur {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  color: #7dd3fc !important;
  background: rgba(56, 189, 248, 0.14) !important;
  border: 1px solid rgba(56, 189, 248, 0.32) !important;
}
.compte-groupes__chevron {
  font-size: 12px !important;
  color: #f472b6 !important;
  transition: transform 0.2s ease !important;
}
details.compte-groupes__groupe:not([open]) .compte-groupes__chevron {
  transform: rotate(-90deg) !important;
}
.compte-kis .compte-groupes details.compte-groupes__groupe > .compte-groupes__detail,
details.compte-groupes__groupe > .compte-groupes__detail {
  padding: 8px 10px !important;
  margin: 0 !important;
  max-height: 170px !important;
  overflow-y: auto !important;
}
.compte-groupes__detail .compte-groupes__membres,
.compte-groupes__membres {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)) !important;
  gap: 6px 8px !important;
  margin: 0 !important;
  width: 100% !important;
}
.compte-groupes__membre {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding: 5px 8px !important;
  border-radius: 9px !important;
  background: rgba(15, 23, 42, 0.78) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  transition: transform 0.15s ease, border-color 0.15s ease !important;
  min-width: 0 !important;
}
.compte-groupes__membre--officiel {
  background: linear-gradient(135deg, rgba(20, 44, 66, 0.88) 0%, rgba(36, 22, 52, 0.85) 100%) !important;
  border-color: rgba(56, 189, 248, 0.42) !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25) !important;
}
.compte-groupes__membre--moi {
  border-color: rgba(212, 255, 57, 0.55) !important;
  box-shadow: 0 0 10px rgba(212, 255, 57, 0.14) !important;
}
.compte-groupes__membre .compte-groupes__avatar {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border-radius: 8px !important;
  font-size: 15px !important;
}
.compte-groupes__membre-infos {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}
.compte-groupes__nom {
  font-size: 12px !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
  line-height: 1.15 !important;
}
.compte-groupes__role {
  font-size: 10px !important;
  font-weight: 500 !important;
  color: #cbd5e1 !important;
  line-height: 1.2 !important;
}
.compte-groupes__membre-actions {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  flex-shrink: 0 !important;
}
.compte-groupes__badge--officiel {
  color: #a3e635 !important;
  background: rgba(163, 230, 53, 0.14) !important;
  border: 1px solid rgba(163, 230, 53, 0.38) !important;
}
.compte-groupes__edit-btn {
  padding: 2px 6px !important;
  min-height: 24px !important;
  height: 24px !important;
  border: 1px solid rgba(244, 114, 182, 0.4) !important;
  border-radius: 6px !important;
  background: rgba(236, 72, 153, 0.12) !important;
  color: #fbcfe8 !important;
  font-size: 11.5px !important;
  cursor: pointer !important;
}
.compte-groupes__edit-btn:hover {
  background: rgba(236, 72, 153, 0.28) !important;
  border-color: #f472b6 !important;
}

/* Avatar sur 1 seule ligne horizontale ultra-compacte */
.compte-kis .espace-perso .avatar-kis {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px 10px !important;
  padding: 2px 0 6px !important;
  margin: 0 0 2px 0 !important;
  border-top: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  flex-wrap: wrap !important;
}
.compte-kis .espace-perso .avatar-kis > h3 {
  display: none !important;
}
.compte-kis .espace-perso .avatar-kis__apercu {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  font-size: 20px !important;
  border-radius: 50% !important;
  border: 2px solid #d4ff39 !important;
  box-shadow: 0 0 10px rgba(212, 255, 57, 0.35) !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #0f172a !important;
}
.compte-kis .espace-perso .avatar-kis__photo {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #e2e8f0 !important;
  margin: 0 !important;
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
  flex: 1 1 180px !important;
  min-width: 0 !important;
}
.compte-kis .espace-perso .avatar-kis__photo input {
  min-height: 26px !important;
  height: 26px !important;
  padding: 2px 6px !important;
  font-size: 11px !important;
  border-radius: 7px !important;
  background: rgba(15, 23, 42, 0.85) !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  color: #f1f5f9 !important;
  max-width: 220px !important;
}
.compte-kis .espace-perso .avatar-kis button {
  min-height: 26px !important;
  height: 26px !important;
  padding: 0 8px !important;
  font-size: 11px !important;
  border-radius: 7px !important;
  margin: 0 !important;
}

/* Formulaire Coordonnées sur 3 lignes compactes (12 colonnes) :
   Ligne 1 : Prénom (4) + Nom (4) + Téléphone (4) = 12
   Ligne 2 : Adresse (5) + Complément (4) + Code postal (3) = 12
   Ligne 3 : Ville (4) + Pays (3) + E-mail (5) = 12
   Ligne 4 : Bouton Enregistrer (12) */
.compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-firstName"],
form[data-profil-perso-form] label[for="perso-firstName"] {
  grid-column: span 4 !important;
  order: 1 !important;
}
.compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-lastName"],
form[data-profil-perso-form] label[for="perso-lastName"] {
  grid-column: span 4 !important;
  order: 2 !important;
}
.compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-phone"],
form[data-profil-perso-form] label[for="perso-phone"] {
  grid-column: span 4 !important;
  order: 3 !important;
}
.compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-address"],
form[data-profil-perso-form] label[for="perso-address"] {
  grid-column: span 5 !important;
  order: 4 !important;
}
.compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-complement"],
form[data-profil-perso-form] label[for="perso-complement"] {
  grid-column: span 4 !important;
  order: 5 !important;
}
.compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-postalCode"],
form[data-profil-perso-form] label[for="perso-postalCode"] {
  grid-column: span 3 !important;
  order: 6 !important;
}
.compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-city"],
form[data-profil-perso-form] label[for="perso-city"] {
  grid-column: span 4 !important;
  order: 7 !important;
}
.compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-country"],
form[data-profil-perso-form] label[for="perso-country"] {
  grid-column: span 3 !important;
  order: 8 !important;
}
.compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-email"],
form[data-profil-perso-form] label[for="perso-email"] {
  grid-column: span 5 !important;
  order: 9 !important;
}
.compte-kis .espace-perso form[data-profil-perso-form] button[type="submit"],
form[data-profil-perso-form] button[type="submit"] {
  order: 10 !important;
}
.compte-kis .espace-perso form[data-profil-perso-form] [data-profil-perso-message],
form[data-profil-perso-form] [data-profil-perso-message] {
  grid-column: 1 / -1 !important;
  order: 11 !important;
  margin: 0 !important;
  font-size: 11px !important;
}

.compte-kis .espace-perso form label,
form[data-profil-perso-form] label {
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.4px !important;
  color: #94a3b8 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.compte-kis .espace-perso form input,
form[data-profil-perso-form] input {
  min-height: 30px !important;
  height: 30px !important;
  padding: 2px 8px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  border-radius: 7px !important;
  background: rgba(10, 18, 30, 0.9) !important;
  border: 1px solid rgba(148, 163, 184, 0.3) !important;
  color: #f8fafc !important;
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  transition: all 0.18s ease !important;
}
.compte-kis .espace-perso form input:focus,
form[data-profil-perso-form] input:focus {
  border-color: #38bdf8 !important;
  box-shadow: 0 0 8px rgba(56, 189, 248, 0.4), inset 0 1px 2px rgba(0, 0, 0, 0.4) !important;
  outline: none !important;
  background: rgba(15, 25, 42, 0.95) !important;
}
.compte-kis .espace-perso form button[type="submit"],
form[data-profil-perso-form] button[type="submit"] {
  grid-column: 1 / -1 !important;
  justify-self: stretch !important;
  width: 100% !important;
  min-height: 32px !important;
  height: 32px !important;
  padding: 0 14px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: -0.1px !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #d4ff39 0%, #a3e635 100%) !important;
  color: #0f172a !important;
  border: none !important;
  margin: 2px 0 0 0 !important;
  cursor: pointer !important;
  box-shadow: 0 3px 10px rgba(212, 255, 57, 0.28) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}
.compte-kis .espace-perso form button[type="submit"]:hover:not(:disabled) {
  transform: translateY(-1px) scale(1.005) !important;
  box-shadow: 0 5px 16px rgba(212, 255, 57, 0.45) !important;
}
.compte-kis .espace-perso form button[type="submit"]:active:not(:disabled) {
  transform: translateY(1px) scale(0.99) !important;
}

/* Bouton Déconnexion */
.compte-kis [data-compte-deconnexion] {
  margin: 0 !important;
  padding: 4px 11px !important;
  min-height: 26px !important;
  height: 26px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  border-radius: 7px !important;
  background: rgba(239, 68, 68, 0.12) !important;
  color: #fca5a5 !important;
  border: 1px solid rgba(239, 68, 68, 0.35) !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}
.compte-kis [data-compte-deconnexion]:hover {
  background: rgba(239, 68, 68, 0.24) !important;
  border-color: #ef4444 !important;
  color: #ffffff !important;
}

/* --- Carte Identifiant de connexion unique Compacte --- */
.compte-kis .identifiantCompte,
.identifiantCompte {
  padding: 10px 12px !important;
  border: 1.5px solid rgba(56, 189, 248, 0.35) !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, rgba(16, 29, 47, 0.94) 0%, rgba(10, 19, 31, 0.98) 100%) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
.compte-kis .identifiantCompte h3,
.identifiantCompte h3 {
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  color: #38bdf8 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}
.compte-kis .identifiantCompte h3::before,
.identifiantCompte h3::before {
  content: '🔑';
  font-size: 12px;
}
.compte-kis .identifiantCompte p:not([role="status"]),
.identifiantCompte p:not([role="status"]) {
  display: block !important;
  font-size: 10.5px !important;
  color: #cbd5e1 !important;
  margin: 0 !important;
  line-height: 1.3 !important;
  background: rgba(56, 189, 248, 0.07) !important;
  border: 1px solid rgba(56, 189, 248, 0.2) !important;
  border-radius: 7px !important;
  padding: 5px 8px !important;
}
.compte-kis .identifiantCompte small,
.identifiantCompte small {
  grid-column: 1 / -1 !important;
  display: block !important;
  font-size: 9.5px !important;
  color: #94a3b8 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}
.compte-kis .identifiantCompte form,
.identifiantCompte form {
  display: grid !important;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) !important;
  gap: 5px 6px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.compte-kis .identifiantCompte label,
.identifiantCompte label {
  grid-column: 1 / -1 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.4px !important;
  color: #7dd3fc !important;
  margin: 0 !important;
}
.compte-kis .identifiantCompte input,
.identifiantCompte input {
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 9px !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  border-radius: 7px !important;
  background: #0a121e !important;
  border: 1.5px solid rgba(56, 189, 248, 0.45) !important;
  color: #f8fafc !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.compte-kis .identifiantCompte input:focus,
.identifiantCompte input:focus {
  border-color: #38bdf8 !important;
  box-shadow: 0 0 8px rgba(56, 189, 248, 0.45) !important;
  outline: none !important;
}
.compte-kis .identifiantCompte button[type="submit"],
.identifiantCompte button[type="submit"] {
  min-height: 30px !important;
  height: 30px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  border-radius: 7px !important;
  background: linear-gradient(135deg, #d4ff39 0%, #a3e635 100%) !important;
  border: none !important;
  color: #0f172a !important;
  cursor: pointer !important;
  margin: 0 !important;
  width: 100% !important;
  box-shadow: 0 3px 10px rgba(212, 255, 57, 0.25) !important;
  transition: all 0.18s ease !important;
  white-space: nowrap !important;
}
.compte-kis .identifiantCompte button[type="submit"]:hover:not(:disabled),
.identifiantCompte button[type="submit"]:hover:not(:disabled) {
  transform: translateY(-1px) !important;
  box-shadow: 0 5px 14px rgba(212, 255, 57, 0.45) !important;
}
.compte-kis .identifiantCompte button[data-identifier-remove],
.identifiantCompte button[data-identifier-remove] {
  min-height: 30px !important;
  height: 30px !important;
  padding: 0 8px !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  border-radius: 7px !important;
  background: rgba(239, 68, 68, 0.12) !important;
  border: 1px solid rgba(239, 68, 68, 0.4) !important;
  color: #fca5a5 !important;
  cursor: pointer !important;
  margin: 0 !important;
  width: 100% !important;
  transition: all 0.18s ease !important;
  white-space: nowrap !important;
}
.compte-kis .identifiantCompte button[data-identifier-remove]:hover:not(:disabled),
.identifiantCompte button[data-identifier-remove]:hover:not(:disabled) {
  background: rgba(239, 68, 68, 0.25) !important;
  border-color: #ef4444 !important;
  color: #ffffff !important;
}
.compte-kis .identifiantCompte button:disabled,
.identifiantCompte button:disabled {
  opacity: 0.35 !important;
  cursor: not-allowed !important;
}
.compte-kis .identifiantCompte [role="status"],
.identifiantCompte [role="status"] {
  font-size: 10.5px !important;
  color: #38bdf8 !important;
  margin: 0 !important;
  min-height: 1.1em !important;
  line-height: 1.3 !important;
}

/* Adaptation mobile iPhone (< 540px) : 2 colonnes pour champs courts */
@media (max-width: 540px) {
  .compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-firstName"],
  .compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-lastName"] {
    grid-column: span 6 !important;
  }
  .compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-phone"],
  .compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-email"],
  .compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-address"] {
    grid-column: span 12 !important;
  }
  .compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-complement"],
  .compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-postalCode"] {
    grid-column: span 6 !important;
  }
  .compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-city"] {
    grid-column: span 7 !important;
  }
  .compte-kis .espace-perso form[data-profil-perso-form] label[for="perso-country"] {
    grid-column: span 5 !important;
  }
}


/* Modale de déconnexion : Simple ou Tous les appareils */
.kisLogoutDialog {
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  border-radius: 16px !important;
  background: #111827 !important;
  color: #f1f5f9 !important;
  padding: 0 !important;
  max-width: 420px !important;
  width: 90% !important;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.6) !important;
  margin: auto !important;
}

.kisLogoutDialog::backdrop {
  background: rgba(0, 0, 0, 0.65) !important;
  backdrop-filter: blur(4px) !important;
}

.kisLogoutBox {
  padding: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.kisLogoutHeader {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.kisLogoutIcon {
  font-size: 22px !important;
}

.kisLogoutHeader h3 {
  margin: 0 !important;
  font: 750 16px system-ui !important;
  color: #fff !important;
}

.kisLogoutSub {
  margin: 0 !important;
  font: 13px/1.45 system-ui !important;
  color: #94a3b8 !important;
}

.kisLogoutChoices {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-top: 6px !important;
}

.kisLogoutOption {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  background: rgba(255, 255, 255, 0.05) !important;
  color: #fff !important;
  cursor: pointer !important;
  text-align: left !important;
  transition: all 0.18s ease !important;
}

.kisLogoutOption:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
  transform: translateY(-1px) !important;
}

.kisLogoutOptIcon {
  font-size: 20px !important;
}

.kisLogoutOptText {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

.kisLogoutOptText strong {
  font: 650 13px system-ui !important;
}

.kisLogoutOptText small {
  font: 11px system-ui !important;
  color: #94a3b8 !important;
}

.kisLogoutOption.btnGlobal:hover {
  border-color: #f87171 !important;
  background: rgba(239, 68, 68, 0.12) !important;
}

.kisLogoutFooter {
  display: flex !important;
  justify-content: flex-end !important;
  margin-top: 6px !important;
}

.kisLogoutCancel {
  background: transparent !important;
  border: none !important;
  color: #94a3b8 !important;
  font: 600 13px system-ui !important;
  cursor: pointer !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
}

.kisLogoutCancel:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

/* Case à cocher Rester connecté automatiquement */
.compteAutoLoginRow {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 10px 0 14px !important;
  font: 500 12.5px system-ui !important;
  color: #cbd5e1 !important;
  cursor: pointer !important;
}

.compteAutoLoginRow input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  accent-color: #d4ff39 !important;
  cursor: pointer !important;
  margin: 0 !important;
}

/* Autocomplétion GPS d'adresse et de ville référencée sur Mon profil */
.profil-gps-dropdown {
  position: absolute !important;
  top: calc(100% + 4px) !important;
  left: 0 !important;
  right: 0 !important;
  min-width: 240px !important;
  max-height: 220px !important;
  overflow-y: auto !important;
  z-index: 999 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  padding: 5px !important;
  background: rgba(11, 19, 36, 0.98) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.65) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.72), 0 0 14px rgba(56, 189, 248, 0.22) !important;
  backdrop-filter: blur(12px) !important;
}

.profil-gps-dropdown[hidden] {
  display: none !important;
}

.profil-gps-item {
  width: 100% !important;
  text-align: left !important;
  padding: 7px 10px !important;
  border-radius: 7px !important;
  border: 1px solid rgba(125, 211, 252, 0.22) !important;
  background: rgba(15, 23, 42, 0.92) !important;
  color: #f8fafc !important;
  font: 600 12px/1.3 system-ui, -apple-system, sans-serif !important;
  cursor: pointer !important;
  transition: background 0.14s ease, border-color 0.14s ease !important;
}

.profil-gps-item.is-city {
  border-color: rgba(16, 185, 129, 0.45) !important;
  background: rgba(6, 78, 59, 0.45) !important;
  color: #ecfdf5 !important;
}

.profil-gps-item:hover,
.profil-gps-item:focus-visible {
  background: rgba(14, 116, 144, 0.55) !important;
  border-color: #38bdf8 !important;
}
