.header {
  width: 100%;
  height: 60px;

  padding: 0 8px;

  position: fixed;

  display: flex;
  align-items: center;

  z-index: 150;

  background: #444A65;
  column-gap: 10px;
}

.header > .header__burger {
  width: 100%;
    max-width: 25px;
  height: 15px;

  position: relative;

  display: flex;
  flex-direction: column;
  justify-content: space-between;

  cursor: pointer;
}

.header > .header__burger > .header__burger__line {
  width: inherit;
  height: 3px;

  border-radius: 1px;

  transition: .3s ease;

  background: #fff;
}

.header > .header__burger > .header__burger__line:nth-child(1) {
  position: absolute;
  top: 0;
}

.header > .header__burger > .header__burger__line:nth-child(2) {
  position: absolute;
  top: 6px;
}

.header > .header__burger > .header__burger__line:nth-child(3) {
  position: absolute;
  top: 6px;
}

.header > .header__burger > .header__burger__line:nth-child(4) {
  position: absolute;
  top: 12px;
}

.header > .header__burger-active > .header__burger__line:nth-child(1),
.header > .header__burger-active > .header__burger__line:nth-child(4) {
  opacity: 0;
}

.header > .header__burger-active > .header__burger__line:nth-child(2) {
  transform: rotate(45deg);
}

.header > .header__burger-active > .header__burger__line:nth-child(3) {
  transform: rotate(-45deg);
}

.header > .header__logo {
 /* margin-left: 35px;*.
}

.header > .header__logo > img {
  width: 152px;
  height: 41px;
}

.header > .header__search {
 /*margin-left: 85px;*/
 width:97%;
 flex:1;
}

@media screen and (max-width: 400px) {
  .header > .header__search {
    display: none;
  }
}

.header > .header__search > input {
  max-width: 480px;
     width: 97%;
  padding: 2px 5px;

  outline: none;
  border: none;
  border-radius: 10px;
}

@media screen and (max-width: 1000px) {
  

  .header > .header__search{
    width: 97%;
  }
}

.header > .header__actions {
  margin-left: auto;

  display: flex;
  gap: 10px;
}
/*
@media screen and (max-width: 1000px) {
  .header > .header__actions {
    display: none;
  }
}
*/

.header > .header__actions > img {
  width: 31px;
  height: 31px;
}


.header > .header__actions > a > img {
  width: 31px;
  height: 31px;
}

.header > .header__actions > div > img {
  width: 31px;
  height: 31px;
  cursor: pointer;
}

.header__sidebar {
  width: 260px;
  height: 100%;
    top: 60px;
  padding: 20px 0;

  position: fixed;
  left: -100%;

  z-index: 50;

  transition: .3s ease;

  background: #FFFFFF;
}

.header__sidebar > .header__sidebar__user {
  padding: 12px;
  text-decoration: auto;
  position: relative;

  display: flex;
  align-items: center;
  gap: 12px;
}

.header__sidebar > .header__sidebar__user > .header__sidebar__user__avatar {
  width: 30px;
  height: 30px;

  border-radius: 50%;

  background: #BE76C7;
}

.header__sidebar > .header__sidebar__user > .header__sidebar__user__info {
  font-family: 'Roboto', sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;

  color: #31AA8F;
}

.header__sidebar > .header__sidebar__menu {
  padding-left: calc(12px + 30px + 12px); /* user padding + user avatar + gap */

  display: flex;
  flex-direction: column;

  border-top: 1px solid #C4C4C4;
}

.header__sidebar > .header__sidebar__menu-actions {
  display: none;
}

@media screen and (max-width: 1000px) {
  .header__sidebar > .header__sidebar__menu-actions {
    display: flex;
  }
}

.header__sidebar > .header__sidebar__menu .header__sidebar__menu__item {
  padding: 12px 0;
  text-decoration: auto;
  font-family: 'Roboto', sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;

  transition: .3s ease;

  color: #727272;
}

.header__sidebar > .header__sidebar__menu .header__sidebar__menu__item:hover {
  opacity: .8;
}

.header__sidebar__menu__divider {
  width: 100%;
  height: 1px;

  opacity: .7;

  background: #727272;
}

/* MESSAGES & ERRORS */
@keyframes message-animation {
  from {top: -60px; opacity: 0}
  to {top: 0; opacity: 100%}
}

@keyframes message-hide-animation {
  from {opacity: 100%}
  to {opacity: 0}
}

ul.messagelist {
  padding: 0;
  margin: 10px 0 10px 0;
  top: -60px;
  opacity: 0;
  display: flex;
  flex-direction: column;
  position: absolute;
  align-items: center;
  width: 100%;
  pointer-events: none;
  animation: message-animation 5s ease-out 5s;
  animation-fill-mode: forwards;
  z-index: 1000001;
}

:root {
  --body-fg: #333;
  --body-bg: #fff;

  --message-success-bg: #dfd;
  --message-warning-bg: #ffc;
  --message-error-bg: #ffefef;
}

ul.messagelist li {
  display: block;
  font-weight: 400;
  font-size: 20px;
  padding: 10px 10px 10px 30px;
  margin: 10px 0 0 0;
  background: var(--message-success-bg) url(../admin/img/icon-yes.svg) 10px 12px no-repeat;
  background-size: 16px auto;
  color: var(--body-fg);
  pointer-events: all;
  border-radius: 5px;
  border: solid #444A65;
  animation: message-hide-animation 10s linear 15s;
  animation-fill-mode: forwards;
  z-index: 1000001;
}
ul.messagelist div {
    border-radius: 5px !important;
    pointer-events: all;
}
.pnotify.pnotify-positioned {
    z-index: 1000001 !important;
}
ul.messagelist li span.msg_close {
  font-size: 15spx;
  margin-left: 10px;
  cursor: pointer;
}

ul.messagelist li.warning {
    background: var(--message-warning-bg) url(../admin/img/icon-alert.svg) 10px 14px no-repeat;
    background-size: 14px auto;
}

ul.messagelist li.error {
    background: var(--message-error-bg) url(../admin/img/icon-no.svg) 10px 12px no-repeat;
    background-size: 16px auto;
}

ul.messagelist li.info {
    background: var(--message-info-bg) url(../admin/img/icon-info.svg) 10px 12px no-repeat;
    background-size: 16px auto;
}