/* REALBOYS FINAL GRID + HEADER + MONITORING FIX
   Last override layer. Goal: no overlapping, stable header/profile/dropdowns, beautiful copyable monitoring cards.
   Safe for UniGameCMS: div#servers = cards, tbody#servers = native table. */

/* ===== global width / clear flow ===== */
:root{
  --rbf-bg:#05070c;
  --rbf-panel:rgba(7,12,21,.92);
  --rbf-card:rgba(9,16,29,.96);
  --rbf-line:rgba(255,255,255,.13);
  --rbf-red:#ff2434;
  --rbf-red2:#ff5a3e;
  --rbf-blue:#39a7ff;
  --rbf-green:#39e66f;
  --rbf-gold:#ffcc34;
  --rbf-text:#f7f9ff;
  --rbf-muted:#a8b4c8;
}
.container,.rb-main-container,.rb-cs-nav,.rb-nav-wrap,.rbcs-guest-page{
  max-width:1580px!important;
  width:calc(100% - 48px)!important;
}
@media(max-width:768px){
  .container,.rb-main-container,.rb-cs-nav,.rb-nav-wrap,.rbcs-guest-page{width:calc(100% - 20px)!important}
}

/* ===== header, profile and dropdowns ===== */
.header,.rb-header,.rb-cs-header,.rb-auth-header,.rb-guest-header{
  position:sticky!important;
  top:0!important;
  z-index:2000!important;
  overflow:visible!important;
  background:linear-gradient(180deg,rgba(3,6,11,.98),rgba(6,10,18,.94))!important;
  border-bottom:1px solid rgba(255,36,52,.28)!important;
  box-shadow:0 14px 38px rgba(0,0,0,.48)!important;
  backdrop-filter:blur(14px);
}
.rb-cs-nav,.rb-nav-wrap,.rb-nav-elite{
  min-height:76px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  overflow:visible!important;
}
.rb-cs-brand,.rb-brand{flex:0 0 auto!important;min-width:0!important}
.rb-cs-menu,.rb-menu-box{flex:1 1 auto!important;min-width:0!important;overflow:visible!important}
.collapsible-menu,.rb-cs-menu-list,.rb-menu-list{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  flex-wrap:nowrap!important;
  overflow:visible!important;
}
.collapsible-menu>li,.rb-cs-menu-list>li,.rb-menu-list>li{
  position:relative!important;
  flex:0 0 auto!important;
  margin:0!important;
  overflow:visible!important;
}
.collapsible-menu>li>a,.rb-cs-menu-list>li>a,.rb-menu-list>li>a{
  height:46px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:0 16px!important;
  border-radius:12px!important;
  border:1px solid rgba(255,255,255,.07)!important;
  background:rgba(255,255,255,.025)!important;
  color:#f3f6ff!important;
  white-space:nowrap!important;
  font-size:14px!important;
  font-weight:900!important;
  line-height:1!important;
  text-decoration:none!important;
  box-shadow:none!important;
}
.collapsible-menu>li>a:hover,.collapsible-menu>li>a.active,
.rb-cs-menu-list>li>a:hover,.rb-cs-menu-list>li>a.active,
.rb-menu-list>li>a:hover,.rb-menu-list>li>a.active{
  background:linear-gradient(180deg,rgba(255,36,52,.2),rgba(255,36,52,.055))!important;
  border-color:rgba(255,36,52,.55)!important;
  color:#fff!important;
  box-shadow:0 0 22px rgba(255,36,52,.20)!important;
}
.rb-sub-arrow,.collapsible-menu>li>a .fa-chevron-down{
  margin-left:auto!important;
  opacity:.86!important;
  font-size:11px!important;
}

/* dropdowns: open nicely and stay above content */
.collapsible-menu li ul,.rb-cs-menu-list li ul,.rb-menu-list li ul,.user-menu li ul{
  position:absolute!important;
  top:calc(100% + 12px)!important;
  left:0!important;
  right:auto!important;
  z-index:3000!important;
  min-width:238px!important;
  width:max-content!important;
  max-width:320px!important;
  display:block!important;
  margin:0!important;
  padding:10px!important;
  list-style:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:translateY(8px) scale(.98)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:16px!important;
  background:rgba(7,12,21,.98)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.62),0 0 0 1px rgba(255,36,52,.08)!important;
  backdrop-filter:blur(18px);
  transition:.16s ease!important;
}
.collapsible-menu li:hover>ul,.collapsible-menu li.rb-open>ul,
.rb-cs-menu-list li:hover>ul,.rb-menu-list li:hover>ul,
.user-menu li:hover>ul,.user-menu li.rb-open>ul{
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  transform:translateY(0) scale(1)!important;
}
.collapsible-menu li ul li a,.rb-cs-menu-list li ul li a,.rb-menu-list li ul li a,.user-menu li ul li a{
  width:100%!important;
  min-height:40px!important;
  height:auto!important;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  padding:10px 12px!important;
  border-radius:11px!important;
  color:#dfe7f8!important;
  background:transparent!important;
  border:0!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  font-size:13px!important;
  font-weight:800!important;
}
.collapsible-menu li ul li a:hover,.rb-cs-menu-list li ul li a:hover,.rb-menu-list li ul li a:hover,.user-menu li ul li a:hover{
  color:#fff!important;
  background:rgba(255,36,52,.16)!important;
  transform:translateX(3px)!important;
}

/* play/profile blocks */
.rb-cs-play,.rb-play-now,[href*="steam://connect"].rb-play-now{
  height:48px!important;
  flex:0 0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  padding:0 28px!important;
  border-radius:12px!important;
  color:#fff!important;
  text-decoration:none!important;
  font-weight:1000!important;
  border:1px solid rgba(255,36,52,.72)!important;
  background:linear-gradient(180deg,rgba(255,36,52,.34),rgba(126,4,12,.66))!important;
  box-shadow:0 0 24px rgba(255,36,52,.33),inset 0 1px 0 rgba(255,255,255,.14)!important;
  white-space:nowrap!important;
}
.user-menu,.rb-user-menu{
  flex:0 0 auto!important;
  overflow:visible!important;
  z-index:2200!important;
}
.user-menu>li>a,.rb-user-menu>li>a{
  min-width:170px!important;
  height:58px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:7px 12px!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  color:#fff!important;
  box-shadow:0 10px 30px rgba(0,0,0,.28)!important;
}
.user-menu img,.rb-user-menu img{width:42px!important;height:42px!important;border-radius:12px!important;object-fit:cover!important}
.user-menu h3,.rb-user-menu h3{font-size:14px!important;margin:0!important;color:#fff!important;font-weight:1000!important;line-height:1.05!important}
.user-menu p,.rb-user-menu p{font-size:11px!important;margin:3px 0 0!important;color:#aeb8c9!important;line-height:1!important}

/* ===== monitoring: fixed flow, no overlaps ===== */
.rbcs-monitoring-panel,
.rbp-monitoring,
.rb-monitoring-shell,
.rb-guest-monitoring,
.monitoring{
  position:relative!important;
  overflow:visible!important;
  height:auto!important;
  min-height:0!important;
  clear:both!important;
  contain:none!important;
}
.rbcs-monitoring-panel{
  display:block!important;
  padding:18px 24px 24px!important;
  margin-bottom:28px!important;
  background:rgba(6,10,18,.88)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:14px!important;
}
.rbcs-monitoring-layout,
.rbcs-monitoring-layout .monitoring,
.rbp-monitoring-row,
.rbp-monitoring-row .monitoring{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  overflow:visible!important;
  height:auto!important;
  min-height:0!important;
}
.rbp-monitoring-row{display:flex!important;align-items:flex-start!important}
.rbp-monitoring-row>[class*="col-"]{min-height:0!important;overflow:visible!important}

/* div#servers only = cards */
.rbcs-monitoring-layout div#servers,
.rbp-monitoring div#servers,
.monitoring:not(.monitoring-table)>div#servers,
div#servers.rb-servers-grid{
  box-sizing:border-box!important;
  position:relative!important;
  display:grid!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
  grid-template-columns:repeat(auto-fit,minmax(255px,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
  grid-auto-flow:row!important;
  grid-auto-rows:auto!important;
  clear:both!important;
}
/* never break native table monitoring */
table #servers,
.monitoring-table #servers,
tbody#servers{
  display:table-row-group!important;
  height:auto!important;
  overflow:visible!important;
}
tbody#servers tr{display:table-row!important}
tbody#servers td{display:table-cell!important}

/* card reset: remove old absolute/float/height conflicts */
#servers>.server.rb-server-card,
#servers>.server,
.server.rb-server-card{
  box-sizing:border-box!important;
  position:relative!important;
  left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
  float:none!important;
  clear:none!important;
  transform:none!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:232px!important;
  margin:0!important;
  padding:17px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-radius:16px!important;
  color:var(--rbf-text)!important;
  border:1px solid rgba(255,255,255,.145)!important;
  background:
    radial-gradient(circle at 100% 0%,rgba(255,36,52,.24),transparent 37%),
    linear-gradient(145deg,rgba(10,17,30,.98),rgba(5,9,17,.96))!important;
  box-shadow:0 18px 44px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.075)!important;
}
#servers>.server.rb-server-card:after{
  content:""!important;
  position:absolute!important;
  inset:0 0 auto 0!important;
  height:2px!important;
  background:linear-gradient(90deg,var(--rbf-red),transparent 34%,var(--rbf-blue))!important;
  opacity:.8!important;
  pointer-events:none!important;
}
#servers>.server.rb-server-card>*{position:relative!important;z-index:2!important}
#servers>.server.rb-server-card:hover{
  border-color:rgba(255,36,52,.42)!important;
  box-shadow:0 22px 54px rgba(0,0,0,.42),0 0 26px rgba(255,36,52,.12),inset 0 1px 0 rgba(255,255,255,.09)!important;
}

/* server content */
.rb-server-card__top{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  min-width:0!important;
  margin:0 0 13px!important;
}
.rb-server-icon{
  width:40px!important;
  height:40px!important;
  flex:0 0 40px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:12px!important;
  color:#fff!important;
  background:linear-gradient(180deg,#ff3241,#a80716)!important;
  box-shadow:0 0 18px rgba(255,36,52,.35)!important;
  overflow:hidden!important;
}
.rb-server-icon img{
  width:25px!important;
  height:25px!important;
  display:block!important;
  object-fit:contain!important;
}
.rb-server-icon img + .rb-fallback-game-icon,
.rb-server-icon img + .rb-fallback-icon{display:none!important}
.rb-fallback-game-icon{width:25px!important;height:25px!important;object-fit:contain!important}
.rb-server-name{
  flex:1 1 auto!important;
  min-width:0!important;
  max-width:100%!important;
  color:#fff!important;
  font-size:16px!important;
  line-height:1.18!important;
  font-weight:1000!important;
  margin:0!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.rb-server-meta{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:9px 12px!important;
  color:#d3def0!important;
  font-size:13px!important;
  line-height:1.2!important;
  margin:0 0 10px!important;
}
.rb-server-meta b{color:#fff!important}
.rb-online-dot{
  width:10px!important;
  height:10px!important;
  flex:0 0 10px!important;
  border-radius:50%!important;
  background:var(--rbf-green)!important;
  box-shadow:0 0 13px var(--rbf-green)!important;
  margin:0!important;
}
.rb-server-progress,.servers-online-line.rb-server-progress{
  position:relative!important;
  height:10px!important;
  min-height:10px!important;
  border-radius:999px!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.09)!important;
  border:0!important;
  margin:9px 0 11px!important;
  cursor:pointer!important;
}
.rb-server-progress .progress-val{display:none!important}
.rb-server-progress .progress-bar{
  height:100%!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#ff2b3b,#ffcc34,#39e66f,#39a7ff)!important;
  box-shadow:none!important;
}
.rb-server-ip-row{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0 0 12px!important;
}
.rb-server-ip{
  flex:1 1 auto!important;
  min-width:0!important;
  height:36px!important;
  display:flex!important;
  align-items:center!important;
  padding:0 11px!important;
  border-radius:10px!important;
  border:1px solid rgba(255,255,255,.11)!important;
  background:rgba(0,0,0,.28)!important;
  color:#e8f0ff!important;
  font-size:12px!important;
  font-weight:800!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.rb-copy-ip{
  flex:0 0 38px!important;
  width:38px!important;
  min-width:38px!important;
}

/* actions: no text spilling, beautiful buttons */
.rb-server-actions{
  margin-top:auto!important;
  display:grid!important;
  grid-template-columns:minmax(112px,1fr) 38px 38px 38px 38px!important;
  gap:8px!important;
  align-items:center!important;
  width:100%!important;
  min-width:0!important;
}
.rb-copy-ip,
.rb-server-actions>a,
.rb-server-actions>button{
  box-sizing:border-box!important;
  height:38px!important;
  min-height:38px!important;
  min-width:0!important;
  border-radius:10px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:rgba(255,255,255,.075)!important;
  color:#fff!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:0 10px!important;
  text-decoration:none!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:1000!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  transition:.15s ease!important;
}
.rb-server-actions>.rb-connect{
  justify-content:center!important;
  padding:0 11px!important;
  color:#fff!important;
  background:linear-gradient(180deg,rgba(255,36,52,.95),rgba(150,6,18,.88))!important;
  border-color:rgba(255,68,72,.68)!important;
  box-shadow:0 0 16px rgba(255,36,52,.24)!important;
}
.rb-server-actions>a:not(.rb-connect):hover,
.rb-server-actions>button:hover,
.rb-copy-ip:hover{
  transform:translateY(-1px)!important;
  border-color:rgba(255,36,52,.52)!important;
  background:rgba(255,36,52,.16)!important;
  box-shadow:0 0 16px rgba(255,36,52,.18)!important;
}
.rb-copied{
  background:linear-gradient(180deg,#35ef79,#13994a)!important;
  color:#06120b!important;
  border-color:rgba(53,239,121,.65)!important;
}

/* sections after monitoring must start below it */
.rbcs-stats,.rbcs-quick,.rbcs-vip-banner,.rbp-monitoring + *, .rbcs-monitoring-panel + *{
  position:relative!important;
  clear:both!important;
  z-index:1!important;
}
.rbcs-stats{margin-top:24px!important}
.rbcs-quick{margin-top:16px!important}

/* auth/register/login pages in same style */
#authorization,.authorization,.auth-form,.registration,.recovery,.rb-auth-card,
form[action*="login"],form[action*="register"]{
  border-radius:18px!important;
}
input,select,textarea,.form-control{
  border-radius:12px!important;
}

/* responsive */
@media(max-width:1320px){
  .collapsible-menu>li>a,.rb-cs-menu-list>li>a,.rb-menu-list>li>a{padding:0 12px!important;font-size:13px!important}
  .rb-cs-play,.rb-play-now{padding:0 20px!important}
}
@media(max-width:1199px){
  .rb-cs-nav,.rb-nav-wrap,.rb-nav-elite{flex-wrap:wrap!important;padding:12px 0!important}
  .rb-cs-menu,.rb-menu-box{order:5!important;flex-basis:100%!important}
  .rb-cs-menu.collapse:not(.show),.rb-menu-box.collapse:not(.show){display:none!important}
  .collapsible-menu,.rb-cs-menu-list,.rb-menu-list{width:100%!important;flex-direction:column!important;align-items:stretch!important;gap:7px!important;padding:8px 0!important}
  .collapsible-menu>li>a,.rb-cs-menu-list>li>a,.rb-menu-list>li>a{width:100%!important;justify-content:flex-start!important}
  .collapsible-menu li ul,.rb-cs-menu-list li ul,.rb-menu-list li ul{
    position:static!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin-top:6px!important;
    display:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
    box-shadow:none!important;
  }
  .collapsible-menu li.rb-open>ul,.rb-cs-menu-list li.rb-open>ul,.rb-menu-list li.rb-open>ul{display:block!important}
  .rbcs-monitoring-layout div#servers,.rbp-monitoring div#servers,.monitoring:not(.monitoring-table)>div#servers{grid-template-columns:repeat(auto-fit,minmax(245px,1fr))!important}
}
@media(max-width:575px){
  .rb-server-actions{grid-template-columns:1fr repeat(2,38px)!important}
  .rb-server-actions>a:nth-child(n+4),.rb-server-actions>button:nth-child(n+4){display:none!important}
  .rb-server-name{white-space:normal!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important}
}