/* Hub UI overrides (layout + header actions)
   - Keep everything inside a centered container (not full width)
   - Provide top-right controls (language, profile, notifications, logout)
*/

.main{
  padding:22px 18px 28px;
}

.mainInner{
  max-width:1180px;
  margin:0 auto;
  width:100%;
}

.topRow{
  gap:16px;
}

.topActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
}

.langForm{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:#333;
}

.langForm label{
  font-weight:600;
}

.langForm select{
  height:32px;
  border:1px solid #ccc;
  border-radius:8px;
  padding:0 10px;
  background:#fff;
}

.iconBtn{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #e5e5e5;
  border-radius:10px;
  background:#fff;
  position:relative;
  text-decoration:none;
}

.iconBtn svg{
  width:18px;
  height:18px;
  stroke:#333;
  fill:none;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.badge{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:999px;
  background:#E6007E;
  color:#fff;
  font-size:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}

.logoutBtn{
  height:34px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border-radius:10px;
  border:1px solid #e5e5e5;
  background:#fff;
  color:#333;
  text-decoration:none;
  font-size:13px;
  font-weight:600;
}

.logoutBtn svg{
  width:18px;
  height:18px;
  stroke:#333;
  fill:none;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

@media (max-width: 900px){
  .topRow{
    flex-wrap:wrap;
  }
  .topActions{
    width:100%;
    justify-content:flex-start;
  }
}