/* REAL BOYS compact monitoring + layout audit fix */
:root{
  --rb-bg:#070a12;
  --rb-panel:#0d1320;
  --rb-panel2:#101827;
  --rb-border:rgba(255,255,255,.10);
  --rb-red:#ff2445;
  --rb-red2:#cf0f2e;
  --rb-text:#f6f8ff;
  --rb-muted:#9aa6bd;
}

/* wider but controlled page layout */
.rb-main-container,
.rb-nav-wrap,
.rb-footer .container,
.header .container,
.container.rb-main-container{
  width:min(96vw, 1580px) !important;
  max-width:1580px !important;
}
.rb-content-grid{align-items:flex-start !important; row-gap:24px !important;}
.rb-main-column{min-width:0 !important;}
.rb-side-column{min-width:280px !important;}

/* keep top menu usable */
.rb-header{position:relative; z-index:1000; overflow:visible !important;}
.rb-nav-wrap,.rb-menu-box,.rb-menu-list{overflow:visible !important;}
.rb-menu-list{display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:0; padding:0;}
.rb-menu-list>li{position:relative; list-style:none;}
.rb-menu-list>li>ul{display:none; position:absolute; top:100%; left:0; min-width:245px; z-index:5000; padding:10px; margin-top:8px; border:1px solid var(--rb-border); border-radius:14px; background:rgba(10,14,24,.98); box-shadow:0 20px 50px rgba(0,0,0,.45),0 0 30px rgba(255,36,69,.15);}
.rb-menu-list>li:hover>ul,.rb-menu-list>li.rb-open>ul{display:block;}
.rb-menu-list>li>ul li{list-style:none; margin:2px 0;}
.rb-menu-list>li>ul a{display:block; padding:9px 10px; border-radius:10px; color:#dce6ff !important; white-space:normal;}
.rb-menu-list>li>ul a:hover{background:rgba(255,255,255,.07); color:#fff !important;}

/* hero spacing so monitoring never overlaps */
.rb-hero-screen{margin-bottom:22px !important;}
.rb-monitoring-section{position:relative !important; z-index:1 !important; margin:24px 0 26px !important; clear:both !important;}
.rb-section-title{display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:14px !important;}
.rb-section-title h2{font-size:22px !important; line-height:1.2 !important; margin:0 !important;}
.rb-section-title a{white-space:nowrap; color:#ff526b !important; font-weight:700;}

/* Compact monitoring grid */
.monitoring.rb-monitoring-cards,
.rb-monitoring-final{
  width:100% !important;
  max-width:100% !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  background:transparent !important;
  overflow:visible !important;
}
#servers.rb-servers-grid,
.rb-servers-grid,
.rb-servers-final{
  position:relative !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit, minmax(258px, 1fr)) !important;
  gap:14px !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
  align-items:stretch !important;
}
#servers .loader{grid-column:1/-1;}
.server.rb-server-card,
.rb-server-card{
  position:relative !important;
  inset:auto !important;
  transform:none !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  height:auto !important;
  min-height:178px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  padding:14px !important;
  border-radius:16px !important;
  border:1px solid rgba(255,255,255,.11) !important;
  border-top:2px solid var(--rb-red) !important;
  background:linear-gradient(180deg,rgba(18,27,43,.96),rgba(9,13,23,.96)) !important;
  box-shadow:0 12px 30px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.04) !important;
  overflow:hidden !important;
}
.rb-server-card:hover{border-color:rgba(255,36,69,.45) !important; box-shadow:0 15px 38px rgba(0,0,0,.38),0 0 24px rgba(255,36,69,.10) !important;}
.rb-server-card__top{display:grid !important; grid-template-columns:36px minmax(0,1fr); align-items:center; gap:10px !important; min-width:0;}
.rb-server-icon{width:36px !important; height:36px !important; display:flex !important; align-items:center !important; justify-content:center !important; border-radius:12px !important; background:rgba(255,36,69,.14) !important; color:#ff3654 !important; flex:0 0 36px !important;}
.rb-server-card h3,
.rb-server-name{
  min-width:0 !important;
  margin:0 !important;
  color:#fff !important;
  font-size:15px !important;
  line-height:1.25 !important;
  font-weight:900 !important;
  letter-spacing:.01em !important;
  white-space:normal !important;
  overflow:hidden !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  max-height:38px !important;
}
.rb-server-meta{display:flex !important; flex-wrap:wrap !important; align-items:center !important; gap:7px 10px !important; color:#cbd6ea !important; font-size:13px !important; line-height:1.15 !important;}
.rb-server-meta b{color:#fff !important;}
.rb-online-dot{display:inline-block !important; width:9px !important; height:9px !important; border-radius:50% !important; background:#56f569 !important; box-shadow:0 0 12px rgba(86,245,105,.75) !important;}
.rb-server-progress{height:13px !important; margin:0 !important; border-radius:999px !important; background:rgba(255,255,255,.09) !important; overflow:hidden !important; cursor:pointer;}
.rb-server-progress .progress-val{position:absolute !important; inset:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; z-index:2 !important; font-size:11px !important; font-weight:900 !important; color:#fff !important; text-shadow:0 1px 2px rgba(0,0,0,.65) !important;}
.rb-server-progress .progress-bar{height:100% !important; border-radius:999px !important; background:linear-gradient(90deg,#ff2445,#2ca8ff) !important;}
.rb-server-ip-row{display:flex !important; align-items:center !important; gap:8px !important; min-width:0 !important;}
.rb-server-ip{
  flex:1 1 auto !important;
  min-width:0 !important;
  display:block !important;
  padding:7px 9px !important;
  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:10px !important;
  background:rgba(0,0,0,.20) !important;
  color:#dce9ff !important;
  font-size:13px !important;
  font-weight:800 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  user-select:text !important;
  cursor:text !important;
}
.rb-copy-ip{
  flex:0 0 34px !important;
  width:34px !important; height:34px !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:10px !important;
  background:rgba(255,255,255,.06) !important;
  color:#fff !important;
  cursor:pointer !important;
}
.rb-copy-ip:hover{background:rgba(255,36,69,.22) !important; border-color:rgba(255,36,69,.55) !important;}
.rb-server-actions{display:grid !important; grid-template-columns:repeat(4, minmax(0,1fr)) !important; gap:7px !important; margin-top:auto !important;}
.rb-server-actions .rb-connect{grid-column:1/-1 !important; min-height:34px !important;}
.rb-server-actions a,.rb-server-actions button{
  min-width:0 !important;
  height:34px !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  padding:0 9px !important;
  border-radius:9px !important;
  border:1px solid rgba(255,255,255,.12) !important;
  background:rgba(255,255,255,.065) !important;
  color:#fff !important;
  font-weight:800 !important;
  font-size:12px !important;
  text-decoration:none !important;
  line-height:1 !important;
}
.rb-server-actions .rb-connect{background:linear-gradient(90deg,rgba(255,36,69,.28),rgba(255,36,69,.10)) !important; border-color:rgba(255,36,69,.45) !important; color:#fff !important; text-transform:uppercase; letter-spacing:.02em;}
.rb-server-actions a:hover,.rb-server-actions button:hover{background:rgba(255,36,69,.18) !important; border-color:rgba(255,36,69,.55) !important;}

/* blocks after monitoring */
.rb-stat-strip,.rb-quick-grid,.rb-vip-banner{clear:both !important; position:relative !important; z-index:0 !important; margin-top:22px !important;}
.rb-quick-grid{display:grid !important; grid-template-columns:repeat(6,minmax(0,1fr)) !important; gap:12px !important;}
.rb-quick-card{min-height:118px !important;}

/* inner pages modern but stable */
.block{border-radius:18px !important; border:1px solid rgba(255,255,255,.10) !important; background:rgba(10,15,25,.92) !important; box-shadow:0 15px 38px rgba(0,0,0,.24) !important; overflow:hidden;}
.block_head,.rb-block-head{background:linear-gradient(90deg,rgba(255,36,69,.18),rgba(15,25,42,.72)) !important; border-bottom:1px solid rgba(255,255,255,.08) !important; color:#fff !important; font-weight:900 !important;}
.table{color:#dfe7f7 !important;}
.table td,.table th{border-color:rgba(255,255,255,.08) !important;}
.form-control, select, textarea{background:#141b29 !important; color:#edf3ff !important; border-color:rgba(255,255,255,.14) !important; border-radius:10px !important;}
.modal-content{background:#0d1422 !important; color:#edf3ff !important; border:1px solid rgba(255,255,255,.13) !important; border-radius:18px !important; overflow:hidden;}
.modal-header{background:linear-gradient(90deg,rgba(255,36,69,.20),rgba(15,25,42,.75)) !important; border-bottom:1px solid rgba(255,255,255,.08) !important;}

@media (min-width:1500px){
  #servers.rb-servers-grid,.rb-servers-grid{grid-template-columns:repeat(4,minmax(0,1fr)) !important;}
}
@media (max-width:1499px) and (min-width:992px){
  #servers.rb-servers-grid,.rb-servers-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
  .rb-quick-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
}
@media (max-width:991px){
  .rb-main-container,.rb-nav-wrap,.rb-footer .container{width:min(96vw, 100%) !important;}
  #servers.rb-servers-grid,.rb-servers-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .rb-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .rb-menu-list{display:block !important;}
  .rb-menu-list>li>ul{position:static !important; margin:6px 0 8px !important; box-shadow:none !important;}
}
@media (max-width:640px){
  #servers.rb-servers-grid,.rb-servers-grid{grid-template-columns:1fr !important;}
  .rb-quick-grid{grid-template-columns:1fr !important;}
  .rb-section-title{align-items:flex-start; flex-direction:column;}
  .rb-server-actions{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
  .rb-server-actions .rb-connect{grid-column:1/-1 !important;}
}
