aside.Menu {
  flex: 0 0 250px;
  background-color: var(--Left-Menu-Background);
  display: flex;
  flex-direction: column;
  height: 100vh;
  position: relative;
}

aside.Menu.Disable .ModalBox { display: block; } 

/***************** Logo **********************/
aside.Menu .Logo {
  font: bold 1.2em/50px sans-serif;
  text-align: center;
  height: 50px;
  color: Black;
  background-color: whitesmoke;
  border-bottom: 1px solid #ccc;
  display: flex;
  align-items: center;  
  justify-content:center;
}

aside.Menu .Logo a { height:90%; text-decoration: none; color: black;}
aside.Menu .Logo img { height:100%; }

/***************** Main Menu **********************/
ul.VMenu { 
  list-style: none;  
  margin: 0;  
  padding: 0; 
  flex: 1;
  overflow-y: auto; 
}

/* Линк в менюто */
ul.VMenu li a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 12px 3px;
  text-decoration: none;
  color: #000;
  font-size: 1em;
  transition: background 0.2s ease;
  border-bottom: 1px solid #90caf9; 
}

ul.VMenu li a:hover { background: #e6f6ff; }

/* Иконата вляво */
ul.VMenu li a i {
  width: 24px;
  text-align: center;
  font-size: 1.2em;
}

ul.VMenu li a span { flex: 1;  text-align: left; }

ul.VMenu li a .arrow {
  margin-left: auto; 
  transition: transform 0.3s ease;
}

ul.VMenu li.open > a .arrow { transform: rotate(90deg); }

ul.VMenu ul.Level1 a { padding-left:16px; }
ul.VMenu ul.Level2 a { padding-left:32px; }
ul.VMenu ul.Level3 a { padding-left:48px; }
/* Подменю */
ul.VMenu ul {
  list-style: none;  
  margin:0;
  padding:0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
/*  border-top: 1px solid #90caf9;*/
}

ul.VMenu li.no-transition a .arrow,
ul.VMenu li.no-transition ul
{
  transition: none !important;
}

/* Подменю open */
ul.VMenu li.open ul { max-height: 500px; }

/* Separator линия */
.separator {
  border-top: 1px solid #aaa;
  margin: 5px 0;
}

/***************** User Menu **********************/
.UserMenu {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  transition: background 0.2s ease;
  border-top: 1px solid #90caf9; 
  font-size: 1em;
}
.UserMenu .LoginTxt { flex:1; }
.UserMenu span.LoginTxt { margin-left:10px; }

.UserMenu a {
  text-decoration: none;
  color: #000;
  padding: 8px 10px; 
}

.UserMenu a.LoginTxt i { margin-right:10px; }

.UserMenu a:hover { background: #e6f6ff; }

/*************** Mobile Header *******************/
nav.Mobile { 
  display:none;
  background-color: whitesmoke;
  height: 32px;
  line-height: 32px;
  justify-content: space-between;
}

nav.Mobile span.Menu {
 font-size: 1.5em;
 margin:0 5px;
}

nav.Mobile .UserMenu span.LoginTxt { margin-right:10px; }
nav.Mobile a { height:32px; text-decoration: none;  color: black; font-weight: bold;}
nav.Mobile .UserMenu a { padding: 0px 5px; }
nav.Mobile .UserMenu .Color
{ margin-left:10px; }

nav.Mobile img { max-height: 90%; display:block; }

  /* Mobile styles */
@media (max-width: 1024px) {
  nav.Mobile { display: flex; }
  nav.Mobile .Menu { cursor: pointer; }

  aside.Menu { 
    position: absolute; 
    left:0; 
    top:35px; 
    z-index:10; 
    background-color: var(--Left-Menu-Background);
    display: none; 
    overflow-y: auto;
    height: calc(100% - 35px);
    width: 100%;
  }

  aside.Menu .Logo { display: none; }
  aside.Menu .UserMenu { display: none; }
}
