/* Display */
#page.site .site-header-cart + a + a {
  display : grid;
}
@media (min-width: 744px) {
  #page.site .site-header-cart + a + a::before {
    display: none;
  }
}
#page.site .site-header-cart + a + a span{
  display : none;
}
@media (min-width: 744px) {
  #page.site .site-header-cart + a + a span{
    display : grid;
  }
}
body.logged-in #page.site .site-header-cart + a + a {
  display : none;
}
body.logged-in #page.site .c-account-menu {
  display : grid;
}
#page.site .c-account-menu > div:nth-child(1) span:nth-child(2) {
  display : none;
}
@media (min-width: 1024px) {
  #page.site .c-account-menu > div:nth-child(1) span:nth-child(2) {
    display : block;
  }
}
#page.site .c-account-menu > div:nth-child(1) span:nth-child(3) {
  display : none;
}
@media (min-width: 1024px) {
  #page.site .c-account-menu > div:nth-child(1) span:nth-child(3) {
    display : block;
  }
}
#page.site .c-account-menu > div:nth-child(1) button {
  display : none;
}
@media (min-width: 1024px) {
  #page.site .c-account-menu > div:nth-child(1) button {
    display : block;
  }
}
#page.site .c-account-menu > div:nth-child(2) {
  display : none;
}
@media (min-width: 1024px) {
  #page.site .c-account-menu > div:nth-child(2) {
    transform : none;
  }
}


/* Block */
#page.site .c-account-menu {
  width       : 52px;
  height      : 52px;
  border-left : 1px solid var(--c-border);
}
@media (min-width: 1024px) {
  #page.site .c-account-menu {
    margin      : 1px;
    width       : calc(100% - 1px);
  }
}

/* Overview */
#page.site .c-account-menu > div:nth-child(1) {
  display               : grid;
  padding               : 7px 8px;
  cursor                : pointer;
  grid-template-columns : 1fr;
  align-items           : center;
  grid-template-areas   : "init"
}
@media (min-width: 1024px) {
  #page.site .c-account-menu > div:nth-child(1) {
    grid-template-columns : 40px 1fr auto;
    column-gap            : 8px;
    grid-template-areas: 
      "init name    button"
      "init company button";
  }
}
#page.site .c-account-menu > div:nth-child(1):focus-within {
  outline : 1px solid var(--c-outline);
}
#page.site .c-account-menu > div:nth-child(1) div {
  grid-area        : init;
  height           : 38px;
  width            : 38px;
  border-radius    : 50%;
  background-color : var(--c-button);
  justify-self     : left;
  display          : grid;
  align-items      : center;
  justify-items    : center;
  font-size        : 21px;
  font-weight      : 400;
  font-family      : var(--c-font-familiy-text);
  color            : white;
}
#page.site .c-account-menu > div:nth-child(1) span:nth-child(2) {
  grid-area   : name;
  font-size   : 14px;
  line-height : 18px;
  font-weight : 500;
  font-family : var(--c-font-familiy-title);
  color       : var(--c-text-title);
}
#page.site .c-account-menu > div:nth-child(1) span:nth-child(3) {
  grid-area   : company;
  font-size   : 12px;
  line-height : 18px ;
  font-weight : 400;
  font-family : var(--c-font-familiy-text);
  color       : var(--c-text-secondary);
}
#page.site .c-account-menu > div:nth-child(1) button {
  grid-area : button;
  padding   : 0;
}
#page.site .c-account-menu > div:nth-child(1) button:focus {
  outline : none !important;
}
#page.site .c-account-menu > div:nth-child(1) button::after {
  content             : '';
  display             : block;
  width               : 16px;
  height              : 16px;
  background          : url(/wp-content/plugins/custom/assets/chevron-down-icon.svg);
  background-repeat   : no-repeat;
  background-position : center;
  background-size     : 16px 16px;
  background-color    : white;
}

/* Menu */
#page.site .c-account-menu > div:nth-child(2) {
  position         : absolute;
  right            : 8px;
  top              : 60px;
  z-index          : 1001;
  width            : 300px;
  border           : 1px solid var(--c-border);
  border-radius    : var(--c-radius);
  background-color : white;
}
@media (min-width: 1024px) {
  #page.site .c-account-menu > div:nth-child(2) {
    right: inherit;
  }
}

@media (min-width: 1180px) {
  .isSafari #page.site .c-account-menu > div:nth-child(2) {
    transform        : translate(0px, 60px);
  }
}
#page.site .c-account-menu.c-open > div:nth-child(2) {
  display : block;
  padding : 8px;
}
#page.site .c-account-menu .c-customer-selection {
  margin : 8px;
}
#page.site .c-account-menu ul {
  list-style  : none;
  margin      : 0;
}
#page.site .c-account-menu ul li a {
  font-size        : 14px;
  line-height      : 20px;
  font-weight      : 500;
  font-family      : var(--c-font-familiy-title);
  color            : var(--c-text-title);
  border-radius    : var(--c-radius);
  padding          : 8px 12px;
  margin           : 0 8px 8px 8px;
  display          : block;
}
#page.site .c-account-menu ul li a:hover {
  background-color : var(--c-background);
  color            : var(--c-text-title) !important;
}
#page.site .c-account-menu ul li a::before {
  content             : '';
  display             : inline-block;
  height              : 16px;
  width               : 16px;
  background-repeat   : no-repeat;
  background-size     : 16px;
  background-position : center center;
  margin-right        : 12px;
  vertical-align      : text-bottom;
}
#page.site .c-account-menu ul li:nth-child(1) a::before {
  background-image    : url(/wp-content/plugins/custom/assets/user-icon.svg);
}
#page.site .c-account-menu ul li:nth-child(2) a::before {
  background-image    : url(/wp-content/plugins/custom/assets/settings-icon.svg);
}
#page.site .c-account-menu ul li:nth-child(3) a::before {
  background-image    : url(/wp-content/plugins/custom/assets/log-out-icon-red.svg);
}
#page.site .c-account-menu ul li:nth-child(3) {
  border-top    : 1px solid var(--c-border);
}
#page.site .c-account-menu ul li:nth-child(3) a {
  margin-bottom : 0;
  color         : var(--c-error);
}
#page.site .c-account-menu ul li:nth-child(3) a:hover {
  color         : var(--c-error) !important;
}
body:has(.woocommerce-MyAccount-navigation-link--edit-account.is-active) 
#page.site .c-account-menu ul li:nth-child(1) a {
  background-color: var(--c-background-dark);
}
body:has(.woocommerce-MyAccount-navigation-link--edit-preferences.is-active) 
#page.site .c-account-menu ul li:nth-child(2) a {
  background-color: var(--c-background-dark);
}

/* Login  Button */
#page.site .site-header-cart + a + a {
  width                 : 52px;
  height                : 52px;
  grid-template-columns : 1fr;
  border-left           : 1px solid var(--c-border);
  align-items           : center;
}
@media (min-width: 744px) {
  #page.site .site-header-cart + a + a {
    width        : auto;
    padding      : 0 24px 0 24px;
  }
}
#page.site .site-header-cart + a + a::before {
  background-image : url(/wp-content/plugins/custom/assets/user-icon.svg);
}
@media (min-width: 744px) {
  #page.site > header .site-header-cart + a + a span::before {
    background-image : url(/wp-content/plugins/custom/assets/user-icon-bright.svg);
  }
}