/* MGR_PUBLIC_OPEN_ROOMS_V1 */
/* MGR_OPEN_ROOMS_COMPACT_V2 */

#mr3dActiveRoomsCount,
#mr3dActiveRoomsPanel .mr3d-active-rooms-empty{
  display:none!important;
}

#mgrOpenRoomsNumber{
  display:inline-flex;
  justify-content:center;
  align-items:center;
  min-width:27px;
  min-height:27px;
  padding:4px 9px;
  margin-left:9px;
  color:#fff;
  font-weight:800;
  font-size:13px;
  border-radius:40px;
  background:linear-gradient(120deg,#1877f2,#a13af3);
}

#mgrOpenRoomsStatus{
  margin:0 0 9px!important;
  padding:0!important;
  color:#adbfdf!important;
  font-size:12px!important;
  text-align:left!important;
}

#mgrOpenRoomsGallery{
  display:flex!important;
  flex-direction:column!important;
  gap:5px!important;
  margin:0!important;
  padding:0!important;
  width:100%;
}

#mgrOpenRoomsGallery .mgr-room-list-line{
  display:grid!important;
  grid-template-columns:30px minmax(0,1fr) auto 12px;
  align-items:center;
  gap:11px;
  width:100%;
  min-height:52px;
  padding:8px 11px!important;
  text-align:left!important;
  color:#f6f7ff!important;
  background:rgba(13,29,67,.76)!important;
  border:1px solid rgba(62,113,211,.30)!important;
  border-radius:11px!important;
  cursor:pointer;
  box-shadow:none!important;
  transition:background .15s,border-color .15s;
}

#mgrOpenRoomsGallery .mgr-room-list-line:hover{
  background:rgba(32,40,97,.91)!important;
  border-color:rgba(158,68,255,.8)!important;
}

#mgrOpenRoomsGallery .mgr-room-list-line:focus-visible{
  outline:2px solid #8be8ff!important;
  outline-offset:2px;
}

#mgrOpenRoomsGallery .mgr-room-list-icon{
  display:grid;
  place-items:center;
  width:29px;
  height:29px;
  color:#62e6ae;
  background:rgba(41,130,101,.16);
  border-radius:9px;
  font-size:18px;
}

#mgrOpenRoomsGallery .mgr-room-list-namebox{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}

#mgrOpenRoomsGallery strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
  font-weight:750;
  color:#fff;
}

#mgrOpenRoomsGallery small{
  color:#8faed5;
  font-size:11px;
}

#mgrOpenRoomsGallery .mgr-room-list-audience{
  color:#c1d5ff;
  font-size:12px;
  white-space:nowrap;
  font-weight:650;
}

#mgrOpenRoomsGallery .mgr-room-list-arrow{
  color:#a66dff;
  font-size:23px;
  line-height:1;
}

/* Fenetre de details, independante des autres modales */

.mgr-room-details-layer[hidden]{
  display:none!important;
}

.mgr-room-details-layer{
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:center;
  padding:18px;
  background:rgba(2,6,23,.82);
  backdrop-filter:blur(8px);
}

.mgr-room-details-dialog{
  position:relative;
  width:min(100%,580px);
  max-height:min(86vh,850px);
  overflow:auto;
  border:1px solid #8540e8;
  border-radius:20px;
  padding:24px;
  color:#f5f5ff;
  background:linear-gradient(145deg,#10234b,#160f35);
  box-shadow:0 25px 65px rgba(0,0,0,.5);
}

.mgr-room-details-close{
  position:absolute;
  top:12px;
  right:12px;
  z-index:2;
  padding:7px 12px;
  border:1px solid #8f5efa;
  border-radius:10px;
  background:#281459;
  color:white;
  cursor:pointer;
}

.mgr-room-details-content{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.mgr-room-details-image{
  width:100%;
  max-height:260px;
  object-fit:cover;
  border-radius:12px;
}

.mgr-room-details-label{
  color:#68ecaa;
  font-size:12px;
  font-weight:800;
}

.mgr-room-details-content h2{
  font-size:clamp(22px,3vw,31px);
  margin:0;
}

.mgr-room-details-meta,
.mgr-room-details-note{
  color:#b9cae9;
  margin:0;
}

.mgr-room-details-description{
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  line-height:1.6;
}

@media(max-width:520px){
  #mgrOpenRoomsGallery .mgr-room-list-line{
    grid-template-columns:25px minmax(0,1fr) auto 10px;
    gap:7px;
    padding:8px!important;
  }
  .mgr-room-details-dialog{padding:17px}
}

@media(prefers-reduced-motion:reduce){
  #mgrOpenRoomsGallery .mgr-room-list-line{
    transition:none!important;
  }
}