/* Media */
/* Variables */
:root {
  --tambar-admin-bar-size: var( --wp-admin--admin-bar--height );
  --tambar-switcher-size: var( --tambar-admin-bar-size );
  --tambar-animation: linear .05s;
}

/* HTML */
html {
  transition: margin var(--tambar-animation);
  /* Desktop */
  /* Mobile */
  /* Hidden */
}
@media screen and (min-width: 783px) {
  html {
    /* Bottom */
  }
  html:has(body.tambar-desktop-bottom) {
    margin-top: 0 !important;
    margin-bottom: var(--tambar-admin-bar-size) !important;
  }
}
@media screen and (max-width: 782px) {
  html {
    /* Bottom */
  }
  html:has(body.tambar-mobile-bottom) {
    margin-top: 0 !important;
    margin-bottom: var(--tambar-admin-bar-size) !important;
  }
}
html:has(body.tambar-hidden) {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Admin Bar */
#wpadminbar {
  --translate-k: 1;
  transition: translate var(--tambar-animation);
  position: fixed;
  /* Bottom */
  /* Hidden */
}
@media screen and (min-width: 783px) {
  body.tambar-desktop-bottom #wpadminbar {
    --translate-k: -1;
    top: unset;
    bottom: 0;
  }
  body.tambar-desktop-bottom #wpadminbar .ab-sub-wrapper {
    box-shadow: 0 -3px 5px rgba(0, 0, 0, 0.2);
    top: unset;
    bottom: 100%;
  }
}
@media screen and (max-width: 782px) {
  body.tambar-mobile-bottom #wpadminbar {
    --translate-k: -1;
    top: unset;
    bottom: 0;
  }
  body.tambar-mobile-bottom #wpadminbar .ab-sub-wrapper {
    box-shadow: 0 -3px 5px rgba(0, 0, 0, 0.2);
    top: unset;
    bottom: 100%;
  }
}
body.tambar-hidden #wpadminbar {
  translate: 0 calc(0px - var(--tambar-admin-bar-size) * var(--translate-k));
}

/* Switcher */
#tambar-switcher {
  background-color: #2c3338;
  width: var(--tambar-switcher-size);
  height: var(--tambar-switcher-size);
  transition: top var(--tambar-animation), bottom var(--tambar-animation);
  cursor: pointer;
  position: fixed;
  top: var(--tambar-admin-bar-size);
  left: var(--tambar-switcher-size);
  z-index: 99999;
  /* Icon */
  /* Bottom */
  /* Right */
  /* Hidden top */
  /* Hidden bottom */
}
#tambar-switcher::after {
  --init-rotation: 0deg;
  content: "";
  background-image: url(../images/arrow.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 40%;
  width: 100%;
  height: 100%;
  rotate: var(--init-rotation);
  position: absolute;
  /* Bottom */
  /* Hidden */
}
@media screen and (min-width: 783px) {
  body.tambar-desktop-bottom #tambar-switcher::after {
    --init-rotation: 180deg;
  }
}
@media screen and (max-width: 782px) {
  body.tambar-mobile-bottom #tambar-switcher::after {
    --init-rotation: 180deg;
  }
}
body.tambar-hidden #tambar-switcher::after {
  rotate: calc(var(--init-rotation) + 180deg);
}
@media screen and (min-width: 783px) {
  body.tambar-desktop-bottom #tambar-switcher {
    top: unset;
    bottom: var(--tambar-admin-bar-size);
  }
}
@media screen and (max-width: 782px) {
  body.tambar-mobile-bottom #tambar-switcher {
    top: unset;
    bottom: var(--tambar-admin-bar-size);
  }
}
@media screen and (min-width: 783px) {
  body.tambar-switcher-desktop-right #tambar-switcher {
    left: unset;
    right: var(--tambar-switcher-size);
  }
}
@media screen and (max-width: 782px) {
  body.tambar-switcher-mobile-right #tambar-switcher {
    left: unset;
    right: var(--tambar-switcher-size);
  }
}
@media screen and (min-width: 783px) {
  body.tambar-hidden.tambar-desktop-top #tambar-switcher {
    top: 0;
  }
}
@media screen and (max-width: 782px) {
  body.tambar-hidden.tambar-mobile-top #tambar-switcher {
    top: 0;
  }
}
@media screen and (min-width: 783px) {
  body.tambar-hidden.tambar-desktop-bottom #tambar-switcher {
    bottom: 0;
  }
}
@media screen and (max-width: 782px) {
  body.tambar-hidden.tambar-mobile-bottom #tambar-switcher {
    bottom: 0;
  }
}

/*# sourceMappingURL=tambar.css.map */