/* Bandieten blue & gold — scoped to the existing CodyChat elements. */
body:has(#global_chat){--dbut-gold:#d8b973;--dbut-gold-light:#f0dfb5;--dbut-line:rgba(65,156,230,.25);--dbut-panel:rgba(4,14,28,.88)}
body:has(#global_chat) #chat_head{background:rgba(3,11,24,.94)!important;border-bottom:1px solid #d8b97370!important;box-shadow:none!important}
body:has(#global_chat) .chat_head_logo img{filter:drop-shadow(0 2px 6px #0006)}
#global_chat #chat_center{background-color:#061020!important;background-image:linear-gradient(rgba(2,9,20,.13),rgba(2,9,20,.38)),url('/default_images/bandieten-chat-bg.png')!important;background-size:cover!important;background-position:center!important;border-left:1px solid var(--dbut-line);border-right:1px solid var(--dbut-line)}
#global_chat #chat_logs,#global_chat #chat_logs_container,#global_chat #show_chat{background:transparent!important}
#global_chat #chat_left,#global_chat #chat_right{background:var(--dbut-panel)!important}
#global_chat .left_top_menu,#global_chat #chat_right_top{background:rgba(3,12,26,.91)!important;border-bottom:1px solid #d8b97345!important}
#global_chat .left_head_empty{color:var(--dbut-gold-light);font-size:13px;letter-spacing:.3px}
#global_chat #left_menu{background:rgba(3,12,26,.95)!important;border-right:1px solid var(--dbut-line)}
#global_chat .left_menu_item{margin-bottom:6px;border-radius:8px;height:38px}
#global_chat .left_menu_item:hover{background:rgba(216,185,115,.1)!important}
#global_chat .left_menu_icon{color:#e7edf5}
#global_chat .left_menu_item.bselected{background:linear-gradient(90deg,#d8b97325,#d8b97308)!important;box-shadow:inset 2px 0 #d8b973}
#global_chat .left_menu_item.bselected .left_menu_icon{color:var(--dbut-gold-light)}
/* Keep actual user-name colors and role assignments unchanged. */
#global_chat #chat_right_data .user_item,#global_chat #chat_right_data .ulist_item{padding:9px 10px;margin:4px 6px;width:calc(100% - 12px);border:1px solid rgba(65,156,230,.22)!important;border-radius:9px!important;background:rgba(3,12,25,.72)!important;box-shadow:none!important;text-shadow:none}
#global_chat #chat_right_data .user_item:hover,#global_chat #chat_right_data .ulist_item:hover{border-color:#d8b97380!important;background:rgba(13,31,49,.94)!important}
#global_chat .user_item_avatar .acav,#global_chat .ulist_avatar img{box-shadow:0 0 0 1px rgba(58,184,255,.6)!important;border:0!important}
#global_chat .user_item_name,#global_chat .ulist_name{font-size:13px}
#global_chat .list_mood{color:#a9b9cd;font-size:11px}
#global_chat .user_count{padding:11px 12px;letter-spacing:1px;font-size:11px;font-weight:800}
/* Compact readable chat; do not constrain sticker or image dimensions. */
#global_chat .ch_logs{padding:7px 12px!important;line-height:1.45;border-bottom:1px solid rgba(99,164,221,.11)}
#global_chat .chat_avatar{width:36px!important}
#global_chat .cavatar{width:34px!important;height:34px!important;box-shadow:0 0 0 1px #2e9cd080}
#global_chat .my_text{padding-left:9px}
#global_chat .my_text .username{font-size:12px!important}
#global_chat .cdate{font-size:9px;color:#8ca1b7}
#global_chat .bubble{padding:6px 10px;border-radius:8px;font-size:14px;line-height:1.5}
#global_chat .mbubble{background:rgba(7,23,39,.84)!important;border:1px solid rgba(91,144,189,.12)}
#global_chat .chat_message a{color:#f0cf82!important;text-shadow:none!important;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
body:has(#global_chat) .back_input{background:rgba(3,12,25,.96)!important;border-top:1px solid #d8b97350!important}
body:has(#global_chat) #content{background:#061322!important;border:1px solid #d8b97345!important;border-radius:22px;color:#eef5ff;font-size:14px!important}
body:has(#global_chat) #content:focus{border-color:#d8b973!important;outline:2px solid #d8b97335;outline-offset:1px}
body:has(#global_chat) #submit_button{color:var(--dbut-gold-light)!important}
/* Existing radio controls keep their original IDs and event handlers. */
#bt-radio-player{width:calc(100% - 24px)!important;max-width:none!important;height:62px!important;bottom:8px!important;border:1px solid #d8b97380!important;border-radius:12px!important;background:linear-gradient(120deg,rgba(4,14,28,.98),rgba(7,18,32,.97))!important;box-shadow:0 8px 25px #0006!important}
#btPlay{width:44px!important;height:44px!important;flex-basis:44px!important;border:2px solid #dfc58b!important;background:linear-gradient(145deg,#29b7ff,#0764cf)!important;box-shadow:0 0 12px #168fff30!important}
#bt-radio-player .bt-now-label{color:#7fcfff!important;font-size:8px!important;letter-spacing:1.5px}
#bt-radio-player .bt-station{display:block!important;color:#f0dfb5;font-size:12px;font-weight:800;line-height:1.25}
#bt-radio-player #bt-now-playing{font-size:12px!important}
#bt-radio-player .bt-equalizer span{background:linear-gradient(to top,#0867d6,#36c7ff)!important}
#btVolume{accent-color:#d8b973!important}
/* Sidebar iframe: framing only, its content is managed by the request server. */
#chat_left_data iframe[src*="verzoek.debandietenuittwente.nl/display.php"]{display:block;width:100%!important;max-width:100%;border:0;background:transparent}
/* Opt-in expandable icon rail, activated by the supplied JavaScript. */
.dbut-menu-ready #left_menu{width:56px!important}
.dbut-menu-ready .dbut-menu-label{display:none}
.dbut-menu-toggle{display:block;width:100%;height:34px;margin:0 0 9px;padding:0;border:1px solid #d8b97345;border-radius:7px;background:#d8b9730b;color:#f0dfb5;font-size:19px;cursor:pointer}
.dbut-menu-toggle:focus-visible{outline:2px solid #f0dfb5;outline-offset:2px}
@media(min-width:1001px){
 .dbut-menu-ready.dbut-menu-expanded #left_menu{width:164px!important}
 .dbut-menu-ready.dbut-menu-expanded .left_menu_icon{width:38px!important}
 .dbut-menu-ready.dbut-menu-expanded .dbut-menu-label{display:table-cell;vertical-align:middle;width:auto;padding:0 6px;color:#dfe8f3;font:600 12px/1.3 Arial,sans-serif;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .dbut-menu-ready .cleft2{left:56px}
 .dbut-menu-ready.dbut-menu-expanded .cleft2{left:164px}
}
@media(max-width:1000px){.dbut-menu-toggle{display:none}.dbut-menu-ready #left_menu{width:50px!important}}
@media(max-width:650px){#global_chat .ch_logs{padding:6px 8px!important}#global_chat .bubble{font-size:13px}#bt-radio-player{height:60px!important;max-width:calc(100% - 14px)!important;border-radius:10px!important}#bt-radio-player .bt-station{font-size:10px}}
@media(prefers-reduced-motion:reduce){#bt-radio-player #bt-now-playing{animation:none!important;padding-left:0!important}#bt-radio-player .bt-equalizer span{animation:none!important}}

/* Definitieve panelen; vervangt de oude zwevende menu-uitvoering. */
body:has(#global_chat){--dbut-gold:#d9b76a;--dbut-gold-light:#f1d89a}
#chat_head{height:64px!important;background:linear-gradient(90deg,#041123ed,#061426de)!important;border-bottom:1px solid #d9b76a!important}
#chat_head .chat_head_logo img{max-height:54px!important}
#global_chat{border-spacing:8px 0!important;padding:8px 4px 0;box-sizing:border-box}
#global_chat #chat_center,#global_chat #chat_right,#dbut-studio-column{border:1px solid #348dc280!important;border-radius:9px!important;overflow:hidden}
#global_chat #chat_center{background-position:center!important}
.dbut-room-heading{height:39px;display:flex;align-items:center;padding:0 16px;background:#031022e8;color:#f1d89a;border-bottom:1px solid #278dcb80;font:700 14px/1.3 Arial,sans-serif;letter-spacing:2px}
#dbut-studio-column{display:table-cell;width:242px;min-width:242px;vertical-align:top;background:linear-gradient(#06172ee8,#02101be8);padding:12px 9px;box-sizing:border-box}
#dbut-studio-column h2{margin:0 0 12px;text-align:center;color:#edcd85;font:800 18px/1.3 Arial,sans-serif;letter-spacing:2px}
#dbut-studio-column iframe{display:block;width:100%;height:330px;border:1px solid #d9b76a90;border-radius:9px;background:transparent}
#dbut-studio-column nav{margin-top:18px;border-top:1px solid #d9b76a}
#dbut-studio-column nav a{display:block;padding:15px 5px;color:#e6edf9;text-decoration:none;border-bottom:1px solid #82b8de20;font:13px/1.4 Arial,sans-serif}
#dbut-studio-column nav a:last-child{color:#83dfff}#dbut-studio-column nav span{float:right;color:#efcf88}
#global_chat #chat_right{width:300px!important;background:#041022ed!important}
#right_panel_bar{background:#041323!important;border-bottom:1px solid #d9b76a80!important}
#chat_right_data::before{content:'ONLINE BANDIETEN';display:block;padding:14px 12px 12px;margin:0 8px 8px;border-bottom:1px solid #d9b76a;color:#edcd85;font:800 15px/1.2 Arial,sans-serif;letter-spacing:1.7px}
#global_chat #chat_right_data .user_item,#global_chat #chat_right_data .ulist_item{padding:9px!important;min-height:58px!important;margin:0 8px 9px!important;width:calc(100% - 16px)!important;border-radius:0 0 8px 8px!important;clip-path:none!important}
#global_chat #chat_right_data .username{font-size:14px!important;text-shadow:none!important}
#global_chat #chat_right_data .dbut-role-heading{clip-path:none!important;border-radius:8px 8px 0 0!important;padding:10px 12px!important;margin:9px 8px 0!important;width:calc(100% - 16px)!important;font-size:12px!important;letter-spacing:1.4px!important;border:1px solid var(--role-color,#d9b76a)!important;background:linear-gradient(100deg,color-mix(in srgb,var(--role-color,#d9b76a) 23%,#07101d),#06101c)!important;color:var(--role-color,#e7c97b)!important;box-shadow:none!important}
#global_chat .ch_logs{padding:8px 12px!important}
#global_chat .chat_avatar{width:44px!important}#global_chat .cavatar{width:40px!important;height:40px!important;border-radius:50%!important}
#global_chat .bubble{font-size:14px!important;line-height:1.4!important;padding:5px 9px!important}
#global_chat .mbubble{background:#061726dc!important;border:0!important}
#global_chat .my_text .username{font-size:13px!important}
#global_chat #content{height:38px!important;border:1px solid #2888bb!important}
#wrap_footer{border-top:1px solid #d9b76a!important;background:#031020!important}
#wrap_footer .bandieten_footer_inner{width:calc(100% - 18px)!important;max-width:none!important;border:1px solid #d9b76a!important;box-shadow:none!important;background:linear-gradient(90deg,#031120,#061426)!important}
#wrap_footer .bandieten_play{color:#25aaff!important;border:2px solid #eccb83!important;border-radius:50%;background:#062851}
#wrap_footer .bandieten_station{color:#f1d89a!important}
#bt-radio-player{border-color:#d9b76a!important}
/* Lege ruimte wordt niet door afbeeldingen in berichten bepaald. */
#chat_logs_container .chat_message img:not(.emo):not(.emoticon){max-width:100%!important}
.dbut-menu-ready #left_menu{width:56px!important;background:transparent!important;border:0!important}
#left_menu_content{padding:0 3px!important}
#left_menu_content #dbut-menu-toggle{position:static!important;width:100%!important;height:32px!important;border-radius:7px!important;background:#071426!important;border:1px solid #d9b76a60!important;color:#efcf88!important;box-shadow:none!important;line-height:30px!important;margin-bottom:10px!important;font-size:20px!important}
@media(min-width:1001px){.dbut-menu-ready.dbut-menu-expanded #left_menu{width:152px!important}.dbut-menu-ready.dbut-menu-expanded .left_menu_item{height:43px!important}}
@media(max-width:1200px){#dbut-studio-column{width:190px;min-width:190px}#dbut-studio-column iframe{height:292px}#global_chat #chat_right{width:250px!important}}
@media(max-width:1000px){#dbut-studio-column{display:none}#global_chat{border-spacing:0;padding:0}.dbut-room-heading{font-size:11px;letter-spacing:1px}#global_chat #chat_right{width:240px!important}}
@media(max-width:600px){#chat_head{height:50px!important}.dbut-room-heading{height:32px;font-size:10px}#global_chat .cavatar{width:30px!important;height:30px!important}#global_chat .chat_avatar{width:34px!important}}

/* Compactere indeling */
#chat_head {
  height: 54px !important;
}

#chat_head .chat_head_logo img {
  max-height: 44px !important;
}

#global_chat {
  height: calc(100dvh - 136px) !important;
  padding-top: 5px !important;
  border-spacing: 6px 0 !important;
}

#dbut-studio-column {
  width: 190px !important;
  min-width: 190px !important;
  padding: 10px 8px !important;
}

#dbut-studio-column h2 {
  font-size: 15px !important;
  margin-bottom: 8px !important;
}

#dbut-studio-column iframe {
  height: 310px !important;
}

#dbut-studio-column nav {
  margin-top: 10px !important;
}

#dbut-studio-column nav a {
  padding: 10px 4px !important;
  font-size: 11px !important;
}

#global_chat #chat_right {
  width: 250px !important;
}

.dbut-room-heading {
  height: 34px !important;
  font-size: 12px !important;
  letter-spacing: 1px !important;
}

/* Typbalk onderaan het chatpaneel */
#chat_center {
  position: relative !important;
  height: 100% !important;
}

#container_chat,
#wrap_chat {
  position: relative !important;
  height: 100% !important;
  min-height: 0 !important;
}

#wrap_chat {
  display: block !important;
}

#warp_show_chat {
  height: calc(100% - 84px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#top_chat_container {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  min-height: 48px !important;
  z-index: 20 !important;
  background: #041120 !important;
}

/* Compactere berichten en gebruikers */
#global_chat .ch_logs {
  padding: 5px 9px !important;
}

#global_chat .chat_avatar {
  width: 34px !important;
}

#global_chat .cavatar {
  width: 30px !important;
  height: 30px !important;
}

#global_chat .bubble {
  padding: 4px 8px !important;
  font-size: 13px !important;
}

#global_chat #chat_right_data .user_item,
#global_chat #chat_right_data .ulist_item {
  min-height: 44px !important;
  padding: 6px 8px !important;
  margin-bottom: 5px !important;
}

#global_chat #chat_right_data .dbut-role-heading {
  padding: 7px 9px !important;
  font-size: 11px !important;
  margin-top: 5px !important;
}

#chat_right_data .acav,
#chat_right_data .ulist_avatar img {
  width: 30px !important;
  height: 30px !important;
}

@media (max-width: 600px) {
  #chat_head {
    height: 50px !important;
  }

  #global_chat {
    height: calc(100dvh - 132px) !important;
    padding: 0 !important;
  }
}

/* Alleen de dubbele onderste menuknop verbergen. */
#rlist_open.footer_item { display:none !important; }
/* Gebruikerslijst-knop rechts in de radioplayer. */
#wrap_footer .bandieten_menu,
#wrap_footer .bandieten_menu i,
.bandieten_footer_inner #rlist_open,
.bandieten_footer_inner #rlist_open i {
  color:#e7c477 !important;
  text-shadow:none !important;
}

/* Houd de panelen binnen het scherm, ook bij hoge sidebar-inhoud. */
body:has(#global_chat) #global_chat {
 display:flex !important;
 gap:6px;
 height:calc(100dvh - 136px) !important;
 min-height:0 !important;
 overflow:hidden !important;
}
#global_chat > #left_menu {flex:0 0 50px;overflow:auto}
.dbut-menu-expanded #global_chat > #left_menu {flex-basis:152px}
#global_chat > #dbut-studio-column {flex:0 0 190px;min-width:0 !important;overflow:auto}
#global_chat > #chat_center {flex:1 1 0;min-width:0;min-height:0;overflow:hidden}
#global_chat > #chat_right {flex:0 0 250px;min-height:0;overflow:hidden}
#global_chat > #chat_left.left_hide {display:none !important}
#global_chat #container_chat,#global_chat #wrap_chat {height:100% !important;min-height:0 !important}
#global_chat #wrap_chat {display:flex !important;flex-direction:column !important}
#global_chat #chat_toping {flex:0 0 auto}
#global_chat .dbut-room-heading {flex:0 0 34px;box-sizing:border-box}
#global_chat #warp_show_chat {flex:1 1 0 !important;height:auto !important;min-height:0 !important}
#global_chat #top_chat_container {position:relative !important;bottom:auto !important;flex:0 0 48px !important;min-height:48px !important;box-sizing:border-box}
/* Dubbele footerknoppen; de gouden knop in de player blijft beschikbaar. */
.footer_item:has(.fa-bars) {display:none !important}
@media(max-width:1000px){
 #global_chat > #dbut-studio-column {display:none !important}
 .dbut-menu-expanded #global_chat > #left_menu {flex-basis:50px}
 #global_chat > #chat_right {flex-basis:240px}
}
@media(max-width:600px){body:has(#global_chat) #global_chat{height:calc(100dvh - 132px) !important;gap:0}}

/* De bestaande audiofunctie blijft werken via de nieuwe radioplayer. */
body:has(#global_chat) #player_menu,
body:has(#global_chat) .footer_item[data-menu="player_menu"] {
 display:none !important;
}

/* Zijpanelen blijven staan; alleen een volle gebruikerslijst scrollt. */
#global_chat > #dbut-studio-column {
 display:flex;
 flex-direction:column;
 align-self:stretch;
 height:100% !important;
 min-height:0 !important;
 overflow:hidden !important;
 box-sizing:border-box;
}
#dbut-studio-column h2 {flex:0 0 auto}
#dbut-studio-column iframe {
 flex:1 1 auto;
 min-height:0 !important;
 height:auto !important;
 max-height:310px;
}
#dbut-studio-column nav {flex:0 0 auto;margin-top:8px !important}
#dbut-studio-column nav a {padding:8px 3px !important;font-size:11px !important}
#global_chat > #chat_right {
 height:100% !important;
 min-height:0 !important;
 flex-direction:column;
}
#global_chat > #chat_right.cright {display:flex !important}
#global_chat > #chat_right.fhide {display:none !important}
#right_panel_bar {flex:0 0 40px;height:40px !important;min-height:40px !important}
#chat_right_data {
 flex:1 1 auto;
 min-height:0 !important;
 height:calc(100% - 40px) !important;
 overflow-y:auto !important;
 overflow-x:hidden !important;
 scrollbar-width:thin;
 scrollbar-color:#b79858 #041120;
}
#chat_right_data::before {
 padding:9px 8px !important;
 margin:0 8px 5px !important;
 font-size:12px !important;
 letter-spacing:1px !important;
}
#global_chat #chat_right_data .dbut-role-heading {
 height:auto !important;
 min-height:0 !important;
 padding:6px 8px !important;
 line-height:1.15 !important;
 margin:5px 8px 0 !important;
 font-size:10px !important;
}
#chat_right_data div:has(> .dbut-role-heading) {
 margin-top:0 !important;
 margin-bottom:0 !important;
 padding-top:0 !important;
 padding-bottom:0 !important;
}
#global_chat #chat_right_data .user_item,
#global_chat #chat_right_data .ulist_item {
 height:auto !important;
 min-height:36px !important;
 padding:5px 7px !important;
 margin:0 8px 4px !important;
}
#global_chat #chat_right_data .username {font-size:12px !important;line-height:1.2 !important}
#chat_right_data .list_mood {font-size:10px !important;line-height:1.2 !important}
#chat_right_data .acav,#chat_right_data .ulist_avatar img {width:26px !important;height:26px !important}
@media(max-width:1000px){#global_chat > #dbut-studio-column {display:none !important}}

/* Smalle gebruikerslijst met rustige, leesbare namen. */
#global_chat #chat_right_data .user_item_data,
#global_chat #chat_right_data .user_item_name,
#global_chat #chat_right_data .ulist_name {
 white-space:normal !important;
 overflow:hidden !important;
 text-overflow:clip !important;
 padding:0 5px !important;
}
#global_chat #chat_right_data .username {
 font-family:Arial,Helvetica,sans-serif !important;
 font-size:12px !important;
 font-weight:600 !important;
 font-style:normal !important;
 line-height:1.3 !important;
 text-shadow:none !important;
 white-space:normal !important;
 overflow-wrap:anywhere !important;
 display:-webkit-box;
 -webkit-box-orient:vertical;
 -webkit-line-clamp:2;
 overflow:hidden !important;
}
#global_chat #chat_right_data .username span {
 font-size:inherit !important;
 font-family:inherit !important;
 font-style:normal !important;
 text-shadow:none !important;
}
#global_chat #chat_right_data .user_item_avatar {width:27px !important}
#global_chat #chat_right_data .user_item_flag {width:18px !important}
#global_chat #chat_right_data .user_item_flag img {width:16px !important}
#global_chat #chat_right_data .dbut-role-heading {
 font-size:10px !important;
 font-weight:700 !important;
 letter-spacing:.6px !important;
 border-radius:5px 5px 0 0 !important;
}
#chat_right_data::before {font-size:11px !important;letter-spacing:.8px !important}

/* Ruimte voor alle bestaande knoppen, inclusief webcam. */
#global_chat #right_panel_bar {
 display:table !important;
 table-layout:fixed !important;
 width:100% !important;
 padding:0 !important;
 overflow:visible !important;
}
#global_chat #right_panel_bar .panel_option,
#global_chat #right_panel_bar .panel_bar_item {
 display:table-cell !important;
 width:32px !important;
 min-width:0 !important;
 height:40px !important;
 padding:0 !important;
 text-align:center !important;
 vertical-align:middle !important;
 font-size:16px !important;
}
#global_chat #right_panel_bar > .bcell_mid {width:0 !important;padding:0 !important}

/* Breder rechterpaneel voor namen, knoppen en verzoeklink. */
@media(min-width:1001px){
 #global_chat > #chat_right.cright {
  width:310px !important;
  flex:0 0 310px !important;
 }
}

/* DBUT: compact members and a scroll area that fits its parent. */
#global_chat > #chat_right.cright {
 min-height:0 !important;
 max-height:100% !important;
 box-sizing:border-box !important;
 overflow:hidden !important;
}
#global_chat #right_panel_bar {
 flex:0 0 40px !important;
}
#global_chat #chat_right_data {
 flex:1 1 0 !important;
 height:0 !important;
 min-height:0 !important;
 max-height:none !important;
 overflow-y:auto !important;
 overflow-x:hidden !important;
 box-sizing:border-box !important;
 padding-bottom:18px !important;
 scroll-padding-bottom:18px;
 overscroll-behavior-y:contain;
 -webkit-overflow-scrolling:touch;
}
#global_chat #chat_right_data::before {
 padding:6px 7px !important;
 margin:0 7px 3px !important;
 font-size:11px !important;
 line-height:16px !important;
}
#global_chat #chat_right_data .dbut-role-heading {
 box-sizing:border-box !important;
 min-height:0 !important;
 height:auto !important;
 margin:4px 7px 2px !important;
 padding:4px 7px !important;
 font-size:10px !important;
 line-height:14px !important;
 width:calc(100% - 14px) !important;
}
#global_chat #chat_right_data .user_item,
#global_chat #chat_right_data .ulist_item {
 box-sizing:border-box !important;
 min-height:36px !important;
 height:auto !important;
 margin:0 7px 3px !important;
 padding:3px 6px !important;
 width:calc(100% - 14px) !important;
}
#global_chat #chat_right_data .user_item_avatar,
#global_chat #chat_right_data .ulist_avatar {
 width:28px !important;
 padding:0 !important;
 vertical-align:middle !important;
}
#global_chat #chat_right_data .user_item_avatar img,
#global_chat #chat_right_data .user_item_avatar .acav,
#global_chat #chat_right_data .ulist_avatar img {
 width:26px !important;
 height:26px !important;
 object-fit:cover;
}
#global_chat #chat_right_data .username {
 font-size:12px !important;
 line-height:15px !important;
}
#global_chat #chat_right_data .list_mood {
 margin:0 !important;
 padding:0 !important;
 font-size:10px !important;
 line-height:12px !important;
}
/* Keep the previously removed duplicate camera hidden. */
#global_chat #right_panel_bar [data-dbut-direct-camera="1"] {
 display:none !important;
}

/* Refined member list: compact spacing without cutting off long names. */
#global_chat #chat_right_data {
 padding:3px 0 22px !important;
 scrollbar-width:thin;
 scrollbar-color:#b99b60 transparent;
}
#global_chat #chat_right_data::-webkit-scrollbar {width:5px}
#global_chat #chat_right_data::-webkit-scrollbar-track {background:transparent}
#global_chat #chat_right_data::-webkit-scrollbar-thumb {
 background:#b99b60;
 border-radius:8px;
}
#global_chat #chat_right_data::before {
 padding:7px 4px !important;
 margin:0 9px 5px !important;
 color:#e6ce96 !important;
 font-size:11px !important;
 letter-spacing:1.1px !important;
 border-bottom-color:#b99b6050 !important;
}
#global_chat #chat_right_data .dbut-role-heading {
 width:calc(100% - 16px) !important;
 margin:6px 8px 3px !important;
 padding:3px 7px !important;
 border:0 !important;
 border-left:2px solid var(--role-color,#d9b76a) !important;
 border-radius:4px !important;
 background:linear-gradient(90deg,color-mix(in srgb,var(--role-color,#d9b76a) 13%,#07101d),#07101d30) !important;
 font-size:10px !important;
 font-weight:700 !important;
 line-height:15px !important;
 letter-spacing:.65px !important;
}
#global_chat #chat_right_data .user_item,
#global_chat #chat_right_data .ulist_item {
 width:calc(100% - 16px) !important;
 min-height:38px !important;
 margin:0 8px 3px !important;
 padding:3px 6px !important;
 border-radius:7px !important;
 border-color:#4f8eaf30 !important;
 background:rgba(4,17,32,.65) !important;
}
#global_chat #chat_right_data .user_item:hover,
#global_chat #chat_right_data .ulist_item:hover {
 border-color:#d9b76a80 !important;
 background:rgba(13,35,54,.9) !important;
}
#global_chat #chat_right_data .user_item_avatar,
#global_chat #chat_right_data .ulist_avatar {width:29px !important}
#global_chat #chat_right_data .user_item_avatar img,
#global_chat #chat_right_data .ulist_avatar img {
 width:26px !important;
 height:26px !important;
 border-radius:50% !important;
}
#global_chat #chat_right_data .username {
 font-size:13px !important;
 font-weight:600 !important;
 line-height:16px !important;
 letter-spacing:0 !important;
}
#global_chat #chat_right_data .list_mood {
 color:#aebdd1 !important;
 font-size:10px !important;
 line-height:12px !important;
}
#global_chat #chat_right_data .user_item_flag {
 width:19px !important;
 padding:0 2px !important;
}
#global_chat #chat_right_data .user_item_flag img {
 width:16px !important;
 height:auto !important;
 vertical-align:middle !important;
}
@media(max-width:600px) {
 #global_chat #chat_right_data .username {font-size:12px !important}
 #global_chat #chat_right_data .user_item,
 #global_chat #chat_right_data .ulist_item {margin-bottom:4px !important}
}

/* Mobile layout: DJ, message area and composer share the available height. */
@media(max-width:1000px){
 body:has(#global_chat) #global_chat {height:var(--dbut-mobile-chat-height,calc(100dvh - 136px)) !important;min-height:0 !important;}
 body:has(#global_chat) #global_chat > #chat_center {display:flex !important;flex-direction:column !important;min-height:0 !important;height:100% !important;}
 body:has(#global_chat) #global_chat #chat_center > #container_chat {flex:1 1 0 !important;height:0 !important;min-height:0 !important;overflow:hidden !important;}
 body:has(#global_chat) #global_chat #wrap_chat {display:flex !important;flex-direction:column !important;height:100% !important;min-height:0 !important;}
 body:has(#global_chat) #global_chat #warp_show_chat {flex:1 1 0 !important;height:auto !important;min-height:0 !important;padding-bottom:0 !important;}
 body:has(#global_chat) #global_chat #top_chat_container {position:relative !important;top:auto !important;bottom:auto !important;left:auto !important;right:auto !important;transform:none !important;display:block !important;flex:0 0 auto !important;height:auto !important;min-height:48px !important;width:100% !important;box-sizing:border-box !important;z-index:20 !important;visibility:visible !important;opacity:1 !important;}
 body:has(#global_chat) #global_chat #content {font-size:16px !important;min-height:38px !important;}
 html.dbut-keyboard-open #wrap_footer,html.dbut-keyboard-open #bt-radio-player {display:none !important;}
 html.dbut-keyboard-open #global_chat #chat_center > #dbut-mobile-dj {display:none !important;}
}
@media(max-width:650px){
 body:has(#global_chat) #global_chat #chat_center > #dbut-mobile-dj {flex:0 0 120px !important;height:120px !important;}
}

@media(max-width:1000px){html.dbut-keyboard-open body:has(#global_chat) #global_chat #chat_center > #dbut-mobile-dj {display:none !important;}}

/* Bound the outer call panel, not only its iframe. */
body:has(#global_chat) #global_chat #chat_center,
body:has(#global_chat) #global_chat #container_chat,
body:has(#global_chat) #global_chat #wrap_chat {
 display:flex !important;flex-direction:column !important;min-height:0 !important;
}
body:has(#global_chat) #global_chat #chat_center {height:100% !important;overflow:hidden !important;}
body:has(#global_chat) #global_chat #container_chat {
 flex:1 1 0 !important;height:0 !important;overflow:hidden !important;
}
body:has(#global_chat) #global_chat #wrap_chat {flex:1 1 0 !important;height:0 !important;overflow:hidden !important;}
body:has(#global_chat) #global_chat #warp_show_chat {
 flex:1 1 0 !important;height:0 !important;min-height:0 !important;overflow:hidden !important;
}
body:has(#global_chat) #global_chat #top_chat_container {
 position:relative !important;inset:auto !important;transform:none !important;
 flex:0 0 auto !important;height:auto !important;min-height:52px !important;
 width:100% !important;box-sizing:border-box !important;z-index:30 !important;
}
body:has(#global_chat) #container_call {
 position:relative !important;inset:auto !important;transform:none !important;
 flex:0 0 auto !important;width:min(420px,100%) !important;max-width:100% !important;
 height:240px !important;min-height:0 !important;max-height:32dvh !important;
 margin:0 auto !important;overflow:hidden !important;box-sizing:border-box !important;
}
body:has(#global_chat) #container_call #wrap_call {
 width:100% !important;height:100% !important;max-width:100% !important;max-height:100% !important;
 min-height:0 !important;overflow:hidden !important;
}
body:has(#global_chat) #container_call .callwidth,
body:has(#global_chat) #container_call iframe {width:100% !important;max-width:100% !important;}
body:has(#global_chat) #container_call .callheight,
body:has(#global_chat) #container_call iframe {height:100% !important;min-height:0 !important;max-height:100% !important;}
body:has(#global_chat) #container_call video {max-width:100% !important;max-height:100% !important;object-fit:contain !important;}
body:has(#global_chat) #container_call.streamout {display:none !important;}
@media(max-width:650px) {
 body:has(#global_chat) #container_call {width:min(320px,100%) !important;height:180px !important;max-height:28dvh !important;}
}

/* Composer anchored to the center panel; camera cannot push it down. */
body:has(#global_chat) #global_chat #chat_center {
 position:relative !important;box-sizing:border-box !important;
 padding-bottom:60px !important;display:flex !important;flex-direction:column !important;
}
body:has(#global_chat) #global_chat #container_chat,
body:has(#global_chat) #global_chat #wrap_chat {
 position:static !important;transform:none !important;contain:none !important;
 flex:1 1 0 !important;min-height:0 !important;height:0 !important;
}
body:has(#global_chat) #global_chat #top_chat_container {
 position:absolute !important;top:auto !important;bottom:0 !important;left:0 !important;right:0 !important;
 width:100% !important;height:60px !important;min-height:60px !important;max-height:60px !important;
 box-sizing:border-box !important;display:block !important;visibility:visible !important;opacity:1 !important;
 transform:none !important;z-index:100 !important;background:#061322 !important;
 padding-bottom:env(safe-area-inset-bottom,0px) !important;
}
body:has(#global_chat) #global_chat #warp_show_chat {
 flex:1 1 0 !important;min-height:0 !important;height:0 !important;padding-bottom:0 !important;
}
body:has(#global_chat) #container_call {
 flex:0 1 200px !important;height:200px !important;max-height:30% !important;min-height:0 !important;
 width:min(420px,100%) !important;
}
body:has(#global_chat) #global_chat .dbut-room-heading,
body:has(#global_chat) #global_chat #chat_toping {flex-shrink:0 !important;}
@media(max-width:650px){
 body:has(#global_chat) #container_call {flex-basis:160px !important;height:160px !important;width:min(320px,100%) !important;}
 body:has(#global_chat) #global_chat #content {font-size:16px !important;}
}

/* Opening layout matching the supplied screenshot: full-width camera strip. */
body:has(#global_chat) #container_call {
 width:100% !important;max-width:100% !important;margin:0 !important;
 flex:0 1 225px !important;height:225px !important;max-height:36% !important;
 border-radius:0 !important;
}
body:has(#global_chat) #container_call #wrap_call,
body:has(#global_chat) #container_call .callwidth,
body:has(#global_chat) #container_call iframe {
 width:100% !important;max-width:100% !important;margin:0 !important;
}
@media(max-width:650px){
 body:has(#global_chat) #container_call {width:100% !important;flex-basis:160px !important;height:160px !important;max-height:32% !important;}
}

/* DBUT 2026-10-20: ruimte tussen gebruikers met eigen Glow */
#global_chat #chat_right_data .user_item,
#global_chat #chat_right_data .ulist_item {
  position:relative !important;
  box-sizing:border-box !important;
  height:auto !important;
  min-height:48px !important;
  margin:5px 9px 13px !important;
  padding:7px 8px !important;
  width:calc(100% - 18px) !important;
  overflow:visible !important;
  isolation:isolate;
}
#global_chat #chat_right_data .user_item_data,
#global_chat #chat_right_data .user_item_name,
#global_chat #chat_right_data .ulist_name {
  min-width:0 !important;
  height:auto !important;
  overflow:visible !important;
}
#global_chat #chat_right_data .username {
  line-height:1.35 !important;
  overflow-wrap:anywhere !important;
}
#global_chat #chat_right_data .dbut-role-heading {
  clear:both;
  position:relative;
  margin-top:9px !important;
}
