/* =========================================================
   NUONAT CHAT - SIDEBAR SALLES V1.7 CLEAN
   Basé sur le TPL réel fourni
   ========================================================= */

/* Conteneur principal */
.nuonat-chat-sidebar-details{
  display:block;
  width:100%;
  margin:0;
  padding:0;
}

/* Ligne principale Nuonat Chat */
.nuonat-chat-sidebar-summary{
  display:flex;
  align-items:center;
  width:100%;
  min-height:46px;

  margin:0 !important;
  padding:8px 15px !important;

  box-sizing:border-box;
  list-style:none;
  cursor:pointer;
  user-select:none;
  color:inherit;
}

.nuonat-chat-sidebar-summary::-webkit-details-marker{
  display:none;
}

.nuonat-chat-sidebar-summary::marker{
  content:"";
}

/* Icône + texte + badge principal */
.nuonat-chat-sidebar-label{
  display:flex;
  align-items:center;
  flex:1 1 auto;
  min-width:0;
}

.nuonat-chat-sidebar-label .main-icon{
  flex:0 0 24px !important;
  width:24px !important;
  height:24px !important;
  margin:0 10px 0 0 !important;
}

/* Flèche */
.nuonat-chat-sidebar-chevron{
  flex:0 0 auto;
  margin-left:auto;
  padding-left:8px;
  font-size:11px;
  line-height:1;
  color:#64748b;
  transition:transform .18s ease;
}

.nuonat-chat-sidebar-details[open] .nuonat-chat-sidebar-chevron{
  transform:rotate(180deg);
}


/* =========================================================
   SOUS-MENU
   ========================================================= */

.nuonat-chat-sidebar-rooms{
  position:relative;
  display:block;
  width:100%;
  margin:2px 0 8px 0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}

/* Repère vertical unique */
.nuonat-chat-sidebar-rooms::before{
  content:"";
  position:absolute;
  left:26px;
  top:7px;
  bottom:7px;
  width:2px;
  border-radius:999px;
  background:#e5eaf2;
}

/* Chaque salle */
.nuonat-sidebar-room-link{
  position:relative;
  display:grid !important;
  grid-template-columns:26px minmax(0,1fr) auto;
  align-items:center;
  column-gap:9px;
  width:100%;
  min-height:40px;

  margin:0 !important;
  padding:5px 14px 5px 42px !important;

  box-sizing:border-box;
  border:0 !important;
  border-radius:8px !important;
  background:transparent !important;

  color:inherit !important;
  text-decoration:none !important;

  transition:background .15s ease;
}

.nuonat-sidebar-room-link:hover{
  background:#f4f7ff !important;
}

/* Icône */
.nuonat-sidebar-room-icon{
  position:relative;
  z-index:1;

  display:flex;
  align-items:center;
  justify-content:center;

  flex:0 0 26px;
  width:26px;
  height:26px;

  margin:0 !important;

  border-radius:8px;
  background:#f3f6fb;

  font-size:14px;
  line-height:1;
}

/* Couleurs distinctes */
.nuonat-sidebar-room-link[href*="room-1"] .nuonat-sidebar-room-icon{
  background:#eef4ff;
}

.nuonat-sidebar-room-link[href*="room-3"] .nuonat-sidebar-room-icon{
  background:#f4efff;
}

.nuonat-sidebar-room-link[data-nuonat-room-type="detente"] .nuonat-sidebar-room-icon{
  background:#fff7dc;
}

.nuonat-sidebar-room-link.is-unavailable{
  opacity:.58;
}

/* Nom */
.nuonat-sidebar-room-name{
  display:block !important;
  min-width:0;

  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  font-size:13px;
  font-weight:650;
  color:#4b5563;
}

/* Badge présence par salle */
.nuonat-sidebar-room-count{
  display:none;

  align-items:center;
  justify-content:center;

  flex:0 0 auto;

  min-width:22px;
  height:22px;
  padding:0 6px;

  margin-left:0;

  border:1px solid #dce5ff;
  border-radius:999px;

  background:#eef2ff;
  color:#5965d8;

  font-size:10.5px;
  font-weight:900;
  line-height:1;
}

/* Focus propre */
.nuonat-chat-sidebar-summary:focus{
  outline:none;
}

.nuonat-chat-sidebar-summary:focus-visible{
  outline:2px solid rgba(37,99,235,.45);
  outline-offset:-2px;
  border-radius:8px;
}

/* Mode sombre */
body.night-mode .nuonat-chat-sidebar-rooms::before,
body[data-bs-theme="dark"] .nuonat-chat-sidebar-rooms::before{
  background:#354052;
}

body.night-mode .nuonat-sidebar-room-link:hover,
body[data-bs-theme="dark"] .nuonat-sidebar-room-link:hover{
  background:#202938 !important;
}

body.night-mode .nuonat-sidebar-room-icon,
body[data-bs-theme="dark"] .nuonat-sidebar-room-icon{
  background:#252f3f;
}

body.night-mode .nuonat-sidebar-room-name,
body[data-bs-theme="dark"] .nuonat-sidebar-room-name{
  color:#dbe3ef;
}

body.night-mode .nuonat-sidebar-room-count,
body[data-bs-theme="dark"] .nuonat-sidebar-room-count{
  background:#273248;
  border-color:#36445d;
  color:#aebcff;
}

/* =========================================================
   V1.8 PREMIUM - MESSAGES NON LUS / BARRE NUONAT
   ========================================================= */

/* Badge non-lu optionnel dans la sidebar */
.nuonat-sidebar-room-unread{
  display:none;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  min-width:22px;
  height:22px;
  padding:0 6px;
  margin-left:6px;
  border-radius:999px;
  background:#e5093d;
  color:#fff;
  font-size:10.5px;
  font-weight:900;
  line-height:1;
  box-shadow:0 3px 10px rgba(229,9,61,.22);
}

/* Badge Premium de la barre personnalisée */
.nuonat-live-unread{
  position:relative;
  display:none;
  align-items:center;
  justify-content:center;
  gap:3px;
  flex:0 0 auto;
  min-width:24px;
  height:22px;
  padding:0 7px;
  margin-left:5px;
  border-radius:999px;
  background:linear-gradient(135deg,#ff304f,#e5093d);
  color:#fff;
  font-size:11px;
  font-weight:800;
  line-height:1;
  box-shadow:
    0 3px 10px rgba(229,9,61,.28),
    inset 0 1px 0 rgba(255,255,255,.18);
  transform:translateZ(0);
}

.nuonat-live-unread-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  line-height:1;
}

.nuonat-live-unread-count{
  line-height:1;
}

.nuonat-live-unread.is-new{
  animation:nuonatUnreadPulse .55s ease;
}

@keyframes nuonatUnreadPulse{
  0%{transform:scale(1)}
  40%{transform:scale(1.18)}
  70%{transform:scale(.96)}
  100%{transform:scale(1)}
}

body.night-mode .nuonat-sidebar-room-unread,
body[data-bs-theme="dark"] .nuonat-sidebar-room-unread{
  background:#f02d55;
  color:#fff;
  box-shadow:0 3px 12px rgba(240,45,85,.22);
}

@media (prefers-reduced-motion:reduce){
  .nuonat-live-unread.is-new{
    animation:none;
  }
}

/* =========================================================
   V1.9 — Ligne compacte au-dessus de la shoutbox
   ========================================================= */
.nuonat-home-rooms{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  width:100%;
  margin:0 0 -1px;
  padding:6px;
  border:1px solid #dfe7f4;
  border-radius:17px 17px 0 0;
  background:linear-gradient(180deg,#f8fbff,#f3f7fd);
  box-sizing:border-box;
  overflow:hidden;
}
.nuonat-home-rooms a{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-width:0;
  width:100%!important;
  min-height:38px;
  padding:7px 6px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#34445c;
  text-decoration:none!important;
  box-shadow:none;
  transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease;
  box-sizing:border-box;
  overflow:hidden;
}
.nuonat-home-rooms a+a{border-left:1px solid #dce5f2;border-radius:0 10px 10px 0}
.nuonat-home-rooms a:hover{background:#fff;box-shadow:0 5px 15px rgba(37,90,175,.08)}
.nuonat-home-rooms a.is-unavailable{opacity:.58}
.nuonat-home-rooms strong,.nuonat-home-rooms .live-text{display:block!important;min-width:0;max-width:none!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:850}
.nuonat-home-room-dot{flex:0 0 8px;width:8px;height:8px;border-radius:999px;box-shadow:0 0 0 3px rgba(65,120,225,.1)}
.nuonat-home-room-dot.is-chat{background:#2f76ed}
.nuonat-home-room-dot.is-visio{background:#8a63e7}
.nuonat-home-room-dot.is-detente{background:#f2aa28}
.nuonat-home-room-count{display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 auto;min-width:23px!important;width:auto!important;height:23px!important;padding:0 6px!important;border:0!important;border-radius:999px!important;background:#edf3ff!important;color:#2866cc!important;font-size:10px!important;font-weight:950!important;line-height:1!important;box-shadow:none!important}
body.night-mode .nuonat-home-rooms a,body[data-bs-theme="dark"] .nuonat-home-rooms a{border-color:#354256;background:#202937;color:#e6edf7}
body.night-mode .nuonat-home-rooms,body[data-bs-theme="dark"] .nuonat-home-rooms{border-color:#354256;background:#1b2431}
body.night-mode .nuonat-home-room-count,body[data-bs-theme="dark"] .nuonat-home-room-count{background:#2a3952;color:#aac4ff}
@media(max-width:420px){
  .nuonat-home-rooms{gap:2px;margin-bottom:-1px;padding:4px}
  .nuonat-home-rooms a{min-height:35px;padding:5px 4px;border-radius:8px;gap:4px}
  .nuonat-home-rooms strong{font-size:11px}
  .nuonat-home-room-count{min-width:21px;height:21px;padding:0 5px;font-size:9px}
}

/* V2.3 — largeur réduite du widget droit : noms toujours complets */
.nuonat-room-switcher.is-widget>.nuonat-room-pill{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 22px!important;
  align-items:center!important;
  justify-content:stretch!important;
  column-gap:5px!important;
  padding:6px 6px!important;
}
.nuonat-room-switcher.is-widget>.nuonat-room-pill>.nuonat-home-room-dot{
  display:none!important;
}
.nuonat-room-switcher.is-widget>.nuonat-room-pill>strong{
  display:block!important;
  width:100%!important;
  min-width:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
  text-align:center!important;
  font-size:11px!important;
}
.nuonat-room-switcher.is-widget>.nuonat-room-pill>.nuonat-home-room-count{
  width:22px!important;
  min-width:22px!important;
  height:22px!important;
  padding:0!important;
  justify-self:end!important;
}
@media(max-width:360px){
  .nuonat-room-switcher.is-widget>.nuonat-room-pill{grid-template-columns:minmax(0,1fr) 20px!important;column-gap:3px!important;padding:5px 3px!important}
  .nuonat-room-switcher.is-widget>.nuonat-room-pill>strong{font-size:10px!important}
  .nuonat-room-switcher.is-widget>.nuonat-room-pill>.nuonat-home-room-count{width:20px!important;min-width:20px!important;height:20px!important}
}

@media(max-width:360px){
  .nuonat-home-room-dot{display:none}
  .nuonat-home-rooms strong,.nuonat-home-rooms .live-text{font-size:10.5px}
}

.nuonat-home-rooms + #nuonat-chat-home-premium{border-top-left-radius:0!important;border-top-right-radius:0!important}
.nuonat-live-bar-wrapper{margin-bottom:14px}
.nuonat-live-bar.nuonat-home-rooms{margin-bottom:0;border-radius:17px;background:#fff}
.nuonat-live-bar.nuonat-home-rooms .nuonat-live-item{width:auto!important;min-width:0!important;margin:0!important;text-decoration:none!important}
.nuonat-live-bar.nuonat-home-rooms .nuonat-live-unread{position:absolute;right:3px;top:1px;transform:scale(.82)}
#nuonat-chat-count-badge{background:#edf3ff!important;color:#2d69ce!important;border:1px solid #d3e1fb!important;box-shadow:none!important}

/* =========================================================
   V2.2 — composants isolés du thème du site
   ========================================================= */
body .sg-offcanvas-sidebar .nuonat-chat-sidebar-details .nuonat-chat-sidebar-rooms>a.nuonat-sidebar-room-link{
  display:flex!important;
  flex-flow:row nowrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:9px!important;
  min-height:42px!important;
  padding:5px 12px 5px 42px!important;
  white-space:nowrap!important;
}
body .sg-offcanvas-sidebar .nuonat-chat-sidebar-rooms>a.nuonat-sidebar-room-link>.nuonat-sidebar-room-icon{
  position:static!important;
  display:inline-flex!important;
  float:none!important;
  clear:none!important;
  flex:0 0 30px!important;
  width:30px!important;
  min-width:30px!important;
  height:30px!important;
  margin:0!important;
  padding:0!important;
}
body .sg-offcanvas-sidebar .nuonat-chat-sidebar-rooms>a.nuonat-sidebar-room-link>.nuonat-sidebar-room-name{
  position:static!important;
  display:block!important;
  float:none!important;
  clear:none!important;
  flex:1 1 auto!important;
  width:auto!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  line-height:30px!important;
}
body .sg-offcanvas-sidebar .nuonat-chat-sidebar-rooms>a.nuonat-sidebar-room-link>.nuonat-sidebar-room-count{
  position:static!important;
  display:inline-flex!important;
  float:none!important;
  clear:none!important;
  flex:0 0 auto!important;
  margin:0 0 0 auto!important;
}

.nuonat-room-switcher{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:0!important;
  width:100%!important;
  margin:0 0 -1px!important;
  padding:6px!important;
  overflow:hidden!important;
  border:1px solid #dfe7f4!important;
  border-radius:18px 18px 0 0!important;
  background:linear-gradient(180deg,#fbfdff,#f1f6fd)!important;
  box-sizing:border-box!important;
}
.nuonat-room-switcher>.nuonat-room-pill{
  position:relative!important;
  display:flex!important;
  flex-flow:row nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  width:100%!important;
  min-width:0!important;
  min-height:40px!important;
  margin:0!important;
  padding:6px 7px!important;
  overflow:hidden!important;
  border:0!important;
  border-radius:11px!important;
  background:transparent!important;
  color:#34445c!important;
  text-decoration:none!important;
  box-shadow:none!important;
  box-sizing:border-box!important;
}
.nuonat-room-switcher>.nuonat-room-pill+.nuonat-room-pill{border-left:1px solid #dce5f2!important;border-radius:0 11px 11px 0!important}
.nuonat-room-switcher>.nuonat-room-pill:hover{background:#fff!important;box-shadow:0 5px 16px rgba(37,90,175,.08)!important}
.nuonat-room-switcher>.nuonat-room-pill>.nuonat-home-room-dot{position:static!important;display:block!important;float:none!important;flex:0 0 8px!important;width:8px!important;min-width:8px!important;height:8px!important;margin:0!important;padding:0!important}
.nuonat-room-switcher>.nuonat-room-pill>strong,
.nuonat-room-switcher>.nuonat-room-pill>.live-text{position:static!important;display:block!important;float:none!important;flex:0 1 auto!important;width:auto!important;min-width:0!important;max-width:none!important;margin:0!important;padding:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:12px!important;line-height:23px!important;font-weight:850!important}
.nuonat-room-switcher>.nuonat-room-pill>.nuonat-home-room-count{position:static!important;display:inline-flex!important;float:none!important;flex:0 0 auto!important;margin:0!important}
.nuonat-room-switcher.is-feed{margin-bottom:0!important;border-radius:18px!important;background:#fff!important;box-shadow:0 9px 28px rgba(38,62,104,.07)!important}
.nuonat-room-switcher.is-widget+#nuonat-chat-home-premium{border-top-left-radius:0!important;border-top-right-radius:0!important}
body.night-mode .nuonat-room-switcher,body[data-bs-theme="dark"] .nuonat-room-switcher{border-color:#354256!important;background:#1b2431!important}
body.night-mode .nuonat-room-switcher>.nuonat-room-pill,body[data-bs-theme="dark"] .nuonat-room-switcher>.nuonat-room-pill{color:#e7edf6!important}
@media(max-width:420px){
  .nuonat-room-switcher{padding:4px!important}
  .nuonat-room-switcher>.nuonat-room-pill{min-height:36px!important;gap:4px!important;padding:5px 4px!important}
  .nuonat-room-switcher>.nuonat-room-pill>strong,.nuonat-room-switcher>.nuonat-room-pill>.live-text{font-size:10.5px!important}
  .nuonat-room-switcher>.nuonat-room-pill>.nuonat-home-room-count{min-width:20px!important;height:20px!important;padding:0 5px!important;font-size:9px!important}
}