.brand-logo-full{max-height:42px;width:auto}.login-logo{max-width:360px;width:100%;height:auto}.sidebar-logo-wrap{display:flex;align-items:center;justify-content:center;padding:.25rem 0}.table thead th{white-space:nowrap}.monitor-page-title{font-size:1.4rem;font-weight:700}.country-badge{display:inline-flex;align-items:center;gap:.35rem;border-radius:999px;padding:.25rem .65rem;background:rgba(45,46,168,.08);color:#2d2ea8;font-size:.8rem;font-weight:600;margin:.15rem}.status-active{color:#198754;font-weight:700}.status-expired{color:#dc3545;font-weight:700}.monitor-card-stat .value{font-size:2rem;font-weight:800}.monitor-filter-card,.monitor-table-card{border-radius:1rem}.monitor-login-page{background:linear-gradient(135deg,#f5f7ff 0%, #eef2ff 100%)}.company-logo-preview{max-height:48px;max-width:140px;width:auto}.main-wrapper{padding-top:78px}.sidebar{top:61px;height:calc(100vh - 61px)}

/* Fixed sidebar/topbar layout */
html, body { overflow-x: hidden !important; }

#topbar.topbar{
  height: 64px !important;
  left: 260px !important;
  right: 0 !important;
  top: 0 !important;
  z-index: 1040 !important;
  background: #fff !important;
  transition: left .25s ease !important;
}

#sidebar.sidebar{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 260px !important;
  height: 100vh !important;
  z-index: 1045 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: #fff !important;
  border-right: 1px solid #e9ecef !important;
  transition: width .25s ease, transform .25s ease !important;
}

#sidebar .sidebar-header{
  min-height: 64px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: .75rem 1rem !important;
}

.brand-logo-full{
  max-width: 170px !important;
  max-height: 40px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}

#sidebar .sidebar-body{
  padding: 1rem !important;
}

#sidebar .nav-link{
  display: flex !important;
  align-items: center !important;
  min-height: 44px !important;
  border-radius: 12px !important;
  padding: .7rem .9rem !important;
}

.main-wrapper{
  margin-left: 260px !important;
  padding-top: 84px !important;
  min-height: 100vh !important;
  transition: margin-left .25s ease !important;
}

body.mr-collapsed #sidebar{
  width: 88px !important;
}

body.mr-collapsed #topbar{
  left: 88px !important;
}

body.mr-collapsed .main-wrapper{
  margin-left: 88px !important;
}

body.mr-collapsed #sidebar .nav-link{
  justify-content: center !important;
  font-size: 0 !important;
  padding-left: .5rem !important;
  padding-right: .5rem !important;
}

body.mr-collapsed #sidebar .nav-link i{
  font-size: 1rem !important;
  margin: 0 !important;
}

body.mr-collapsed .brand-logo-full{
  max-width: 42px !important;
  max-height: 42px !important;
}

#overlay.overlay{
  position: fixed !important;
  inset: 0 !important;
  background: rgba(15,23,42,.45) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity .2s ease !important;
  z-index: 1044 !important;
}

@media (max-width: 991.98px){
  #topbar.topbar{
    left: 0 !important;
  }
  #sidebar.sidebar{
    transform: translateX(-100%) !important;
    width: 280px !important;
  }
  body.mr-mobile-open #sidebar.sidebar{
    transform: translateX(0) !important;
  }
  body.mr-mobile-open #overlay.overlay{
    opacity: 1 !important;
    visibility: visible !important;
  }
  .main-wrapper{
    margin-left: 0 !important;
  }
  body.mr-collapsed .main-wrapper{
    margin-left: 0 !important;
  }
  body.mr-collapsed #topbar{
    left: 0 !important;
  }
}

/* neutralize previous broken offsets */
.sidebar{ top: 0 !important; height: 100vh !important; }


/* v2 hard layout reset */
body{margin:0 !important;}
#sidebar, #topbar, .main-wrapper{box-sizing:border-box !important;}

#sidebar{
  position:fixed !important;
  inset:0 auto 0 0 !important;
  width:260px !important;
  min-width:260px !important;
  max-width:260px !important;
  height:100vh !important;
  top:0 !important;
  left:0 !important;
  margin:0 !important;
  padding:0 !important;
  transform:none !important;
  z-index:2000 !important;
  background:#fff !important;
}

#sidebar .sidebar-inner{
  min-height:100vh !important;
}

#topbar{
  position:fixed !important;
  top:0 !important;
  left:260px !important;
  width:calc(100% - 260px) !important;
  height:64px !important;
  margin:0 !important;
  z-index:1900 !important;
  background:#fff !important;
}

.main-wrapper{
  position:relative !important;
  width:calc(100% - 260px) !important;
  margin-left:260px !important;
  margin-top:0 !important;
  padding-top:84px !important;
  padding-left:0 !important;
  padding-right:0 !important;
  min-height:100vh !important;
  z-index:1 !important;
}

.main-wrapper .container-fluid{
  width:100% !important;
  max-width:none !important;
}

#sidebar .sidebar-header{
  width:100% !important;
}

#sidebar .nav{
  margin:0 !important;
  padding:0 !important;
}

#sidebar .nav li{
  list-style:none !important;
}

#sidebar .nav-link span{
  display:inline !important;
}

body.mr-collapsed #sidebar{
  width:88px !important;
  min-width:88px !important;
  max-width:88px !important;
}

body.mr-collapsed #topbar{
  left:88px !important;
  width:calc(100% - 88px) !important;
}

body.mr-collapsed .main-wrapper{
  width:calc(100% - 88px) !important;
  margin-left:88px !important;
}

body.mr-collapsed #sidebar .nav-link span{
  display:none !important;
}

body.mr-collapsed #sidebar .nav-link{
  justify-content:center !important;
}

body.mr-collapsed #sidebar .brand-logo-full{
  max-width:44px !important;
}

@media (max-width: 991.98px){
  #sidebar{
    transform:translateX(-100%) !important;
    width:280px !important;
    min-width:280px !important;
    max-width:280px !important;
  }
  body.mr-mobile-open #sidebar{
    transform:translateX(0) !important;
  }
  #topbar{
    left:0 !important;
    width:100% !important;
  }
  .main-wrapper{
    width:100% !important;
    margin-left:0 !important;
  }
  body.mr-collapsed #topbar{
    left:0 !important;
    width:100% !important;
  }
  body.mr-collapsed .main-wrapper{
    width:100% !important;
    margin-left:0 !important;
  }
}


/* --- monitor radio v3 --- */
html, body { overflow-x: hidden !important; }
body { background: #f7f8fb !important; }

#sidebar {
  position: fixed !important;
  top: 0 !important; left: 0 !important; bottom: 0 !important;
  width: 250px !important;
  background: #fff !important;
  z-index: 1040 !important;
  border-right: 1px solid #eceef3 !important;
  overflow-y: auto !important;
  transition: width .22s ease, transform .22s ease !important;
}
#topbar {
  position: fixed !important;
  top: 0 !important; left: 250px !important; right: 0 !important;
  height: 72px !important;
  background: #fff !important;
  z-index: 1030 !important;
  border-bottom: 1px solid #eceef3 !important;
  transition: left .22s ease !important;
}
.main-wrapper {
  margin-left: 250px !important;
  padding-top: 96px !important;
  min-height: 100vh !important;
  transition: margin-left .22s ease !important;
}
.sidebar-header {
  min-height: 82px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.sidebar-logo-wrap { display:flex; align-items:center; justify-content:center; width:100%; min-height:52px; }
.brand-logo-full { max-width: 165px !important; max-height: 42px !important; width:auto !important; height:auto !important; display:block !important; object-fit:contain !important; }
.brand-logo-mini { display:none; max-width:40px; max-height:40px; width:auto; height:auto; object-fit:contain; }
#sidebar .nav-link {
  display:flex !important; align-items:center !important;
  gap:.55rem;
  min-height: 44px !important;
  margin-bottom: .2rem;
  padding: .75rem .95rem !important;
  border-radius: 12px !important;
  font-weight: 500;
  color: #2d2f35 !important;
}
#sidebar .nav-link:hover, #sidebar .nav-link.active {
  background: rgba(45,46,168,.08) !important;
  color: #2d2ea8 !important;
}
#sidebar .nav-link i { font-size: 1.12rem; }

body.mr-collapsed #sidebar { width: 88px !important; }
body.mr-collapsed #topbar { left: 88px !important; }
body.mr-collapsed .main-wrapper { margin-left: 88px !important; }
body.mr-collapsed .brand-logo-full { display:none !important; }
body.mr-collapsed .brand-logo-mini { display:block !important; }
body.mr-collapsed #sidebar .nav-link span { display:none !important; }
body.mr-collapsed #sidebar .nav-link { justify-content:center !important; padding-left:.5rem !important; padding-right:.5rem !important; }

#overlay {
  position: fixed !important; inset:0 !important; background: rgba(17,24,39,.45) !important;
  opacity:0; visibility:hidden; transition:opacity .2s ease !important; z-index:1035 !important;
}
body.mr-mobile-open #overlay { opacity:1; visibility:visible; }

.login-logo { max-width: 360px; width:100%; height:auto; }
.company-logo-preview { max-height: 52px; max-width: 150px; }
.country-badge { display:inline-flex; align-items:center; gap:.35rem; padding:.25rem .65rem; background:rgba(45,46,168,.08); color:#2d2ea8; border-radius:999px; font-size:.82rem; font-weight:600; margin:.15rem; }
.status-active { color:#198754; font-weight:700; }
.status-expired { color:#dc3545; font-weight:700; }
.monitor-card-stat .value { font-size:2rem; font-weight:800; }
.table-search { min-width: 240px; }
.sortable-table th[data-sort] { cursor:pointer; user-select:none; }
.sortable-table th[data-sort]:after { content:" ↕"; font-size:.8em; color:#a0a4ab; }

@media (max-width: 991.98px){
  #sidebar { transform: translateX(-100%) !important; width: 280px !important; }
  body.mr-mobile-open #sidebar { transform: translateX(0) !important; }
  #topbar { left: 0 !important; }
  .main-wrapper { margin-left: 0 !important; }
  body.mr-collapsed #topbar { left: 0 !important; }
  body.mr-collapsed .main-wrapper { margin-left: 0 !important; }
}
