.auth-box{
  position:relative;
  flex:0 0 auto;
  display:flex;
  align-items:center;
}

.auth-form{
  display:flex;
  align-items:center;
  gap:5px;
  margin:0;
}

.auth-box input{
  height:32px !important;
  padding:0 8px !important;
  border:1px solid #d4e0e7 !important;
  border-radius:8px !important;
  background:#fff !important;
  color:#0b2337 !important;
  font-size:12px !important;
  outline:none !important;
}

.auth-box input:focus{
  border-color:#8eb9d0 !important;
  box-shadow:0 0 0 2px rgba(20,121,184,.09);
}

.auth-user-input{
  width:78px !important;
}

.auth-password-input{
  width:104px !important;
}

.auth-submit,
.auth-logout{
  height:32px;
  padding:0 10px;
  border:1px solid #b9ceda;
  border-radius:8px;
  background:#f5f9fb;
  color:#194866;
  font-size:12px;
  font-weight:650;
  cursor:pointer;
}

.auth-submit:hover,
.auth-logout:hover{
  background:#eaf3f7;
}

.auth-submit:disabled{
  opacity:.55;
  cursor:default;
}

.auth-admin{
  display:flex;
  align-items:center;
  gap:7px;
  height:32px;
  padding-left:9px;
  border-left:1px solid #dce5eb;
}

.auth-admin strong{
  color:#1c8b68;
  font-size:12px;
}

.auth-error{
  position:absolute;
  top:36px;
  right:0;
  z-index:50;
  display:none;
  width:max-content;
  max-width:260px;
  padding:5px 8px;
  border:1px solid #efc4c7;
  border-radius:7px;
  background:#fff5f5;
  color:#a93f46;
  font-size:11px;
  box-shadow:0 4px 14px rgba(11,35,55,.08);
}

.auth-error.show{
  display:block;
}

@media(max-width:1150px){
  .auth-box{
    flex-basis:100%;
    justify-content:flex-end;
  }
}

                        

.auth-form[hidden],
.auth-admin[hidden]{
  display:none !important;
}

.topbar{
  position:relative !important;
}

.topbar .auth-box{
  position:absolute !important;
  right:0 !important;
  top:-10px !important;

  width:auto !important;
  margin:0 !important;

  z-index:20;
}

.auth-form{
  display:flex;
  align-items:center;
  gap:5px;
}

.auth-user-input{
  width:92px !important;
}

.auth-password-input{
  width:112px !important;
}

@media(max-width:1150px){

  .topbar .auth-box{
    position:static !important;
    width:100% !important;
    justify-content:flex-end;
    margin-top:4px !important;
  }

}

                          
.auth-admin-tab[hidden]{display:none !important;}