.header-dropdown-profile {
    display: flex;
    align-items: center;
    justify-content: center;
    width: theme(digitv2.spacers.spacer8);
    height: theme(digitv2.spacers.spacer8);
    overflow: hidden;
    border-radius: 50%;
  
    &.text {
      color: theme(digitv2.lightTheme.paper-primary);
      font-weight: 700;
      background: theme(digitv2.lightTheme.primary-2);
    }
  
    &.dark {
      &.text {
        background: theme(digitv2.lightTheme.paper-primary);
        font-weight: 700;
        color: theme(digitv2.lightTheme.primary-2);
      }
    }
  
    img {
      width: 100%;
      height: auto;
      display: block;
    }
  }
  
  .header-dropdown-label {
    @extend .typography.body-s;
    cursor: pointer;
    font-family: theme(digitv2.fontFamily.sans);
    font-style: theme(digitv2.fontStyle.normal);
    font-weight: theme(digitv2.fontWeight.regular);
    line-height: theme(digitv2.lineHeight.lineheight2);

    @media (max-aspect-ratio: 9/16) {
      /* Media query for mobile */
      font-size: theme(digitv2.fontSize.body-s.mobile);
    }

    @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
      /* Media query for tablets */
      font-size: theme(digitv2.fontSize.body-s.tablet);
    }

    @media (min-aspect-ratio: 3/4) {
      /* Media query for desktop */
      font-size: theme(digitv2.fontSize.body-s.desktop);
    }
    display: flex;
    align-items: center;
    color: theme(digitv2.lightTheme.text-primary);
    position: relative;
  
    &.dark {
      color: theme(digitv2.lightTheme.paper-primary);
    }
  }
  
  .header-dropdown-arrow {
    margin-left: theme(digitv2.spacers.spacer2);
    width: theme(digitv2.spacers.spacer6);
    height: theme(digitv2.spacers.spacer6);
  }
  
  .header-dropdown-menu {
    width: fit-content !important;
    box-shadow: theme(digitv2.spacers.spacer0) 0.063rem 0.275rem theme(digitv2.spacers.spacer0) #00000026;
    max-height: 80%;
    background-color: theme(digitv2.lightTheme.paper-primary);
    margin-top: theme(digitv2.spacers.spacer6);
    position: fixed;
    min-width: 14rem;
    max-width: 25rem;
    @apply z-30 overflow-y-auto overflow-x-hidden;

    &.underProfile{
      margin-top: theme(digitv2.spacers.spacer5);
    }
  }
  
  .header-dropdown-search-container {
    height: 3.5rem;
    min-width: 14rem;
    max-width: 25rem;
    width: auto;
    padding: theme(digitv2.spacers.spacer3) !important;
  }
  
  .header-dropdown-search {
    height: theme(digitv2.spacers.spacer8) !important;
    min-width: 12.5rem;
    max-width: 23.5rem;
  
    .digit-text-input-customIcon {
      height: theme(digitv2.spacers.spacer5);
      width: theme(digitv2.spacers.spacer5);
      top: 0.4rem;
      right: theme(digitv2.spacers.spacer4);
    }
  
    .input-container {
      max-height: 100%;
    }
  
    input {
      max-height: 100%;
    }
  }
  
  .header-dropdown-options {
    max-height: 12.5rem;
    overflow-y: auto;
  }
  
  .header-dropdown-option {
    @extend .typography.body-s;
    @apply whitespace-no-wrap w-full max-w-full overflow-hidden;
    font-family: theme(digitv2.fontFamily.sans);
    font-style: theme(digitv2.fontStyle.normal);
    font-weight: theme(digitv2.fontWeight.regular);
    line-height: theme(digitv2.lineHeight.lineheight2);

    @media (max-aspect-ratio: 9/16) {
      /* Media query for mobile */
      font-size: theme(digitv2.fontSize.body-s.mobile);
    }

    @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
      /* Media query for tablets */
      font-size: theme(digitv2.fontSize.body-s.tablet);
    }

    @media (min-aspect-ratio: 3/4) {
      /* Media query for desktop */
      font-size: theme(digitv2.fontSize.body-s.desktop);
    }
    padding: theme(digitv2.spacers.spacer4) 0.625rem;
    color: theme(digitv2.lightTheme.text-primary);
    gap: theme(digitv2.spacers.spacer2);
    height: theme(digitv2.spacers.spacer10);
    display: flex;
    align-items: center;
    word-break: break-word;
    text-overflow: ellipsis;
    cursor: pointer;

    svg {
      flex-shrink: 0;
    }
  }
  
  .header-dropdown-option:not(:hover):not(:active):nth-of-type(2n +1) {
    background-color: theme(digitv2.lightTheme.paper-secondary);
  }
  
  .header-dropdown-nooption {
    @extend .typography.body-s;
    font-family: theme(digitv2.fontFamily.sans);
    font-style: theme(digitv2.fontStyle.normal);
    font-weight: theme(digitv2.fontWeight.regular);
    line-height: theme(digitv2.lineHeight.lineheight2);

    @media (max-aspect-ratio: 9/16) {
      /* Media query for mobile */
      font-size: theme(digitv2.fontSize.body-s.mobile);
    }

    @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
      /* Media query for tablets */
      font-size: theme(digitv2.fontSize.body-s.tablet);
    }

    @media (min-aspect-ratio: 3/4) {
      /* Media query for desktop */
      font-size: theme(digitv2.fontSize.body-s.desktop);
    }
    padding: theme(digitv2.spacers.spacer2);
    pointer-events: none;
    color: theme(digitv2.lightTheme.text-disabled);
    background-color: theme(digitv2.lightTheme.paper-secondary);
  }
  
  .header-dropdown-option:hover,
  .header-dropdown-option.keyChange {
    background: theme(digitv2.lightTheme.primary-bg) !important;
    border: 0.031rem solid theme(digitv2.lightTheme.primary-1);
  }
  
  .header-dropdown-option:active,
  .header-dropdown-option.activeIndex {
    @extend .typography.heading-s;
    background: theme(digitv2.lightTheme.primary-1) !important;
    color: theme(digitv2.lightTheme.paper-primary);

    font-family: theme(digitv2.fontFamily.sans);
    font-style: theme(digitv2.fontStyle.normal);
    font-weight: theme(digitv2.fontWeight.bold);
    line-height: theme(digitv2.lineHeight.lineheight1);

    @media (max-aspect-ratio: 9/16) {
      /* Media query for mobile */
      font-size: theme(digitv2.fontSize.heading-s.mobile);
    }

    @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
      /* Media query for tablets */
      font-size: theme(digitv2.fontSize.heading-s.tablet);
    }

    @media (min-aspect-ratio: 3/4) {
      /* Media query for desktop */
      font-size: theme(digitv2.fontSize.heading-s.desktop);
    }
  }
  
  .header-dropdown-options::-webkit-scrollbar {
    width: theme(digitv2.spacers.spacer2);
    background-color: theme(digitv2.lightTheme.generic-background);
  }
  
  .header-dropdown-options::-webkit-scrollbar-track {
    background-color: theme(digitv2.lightTheme.generic-background);
    border-radius: 0.563rem;
  }
  
  .header-dropdown-options::-webkit-scrollbar-thumb {
    background-color: theme(digitv2.lightTheme.generic-divider);
    border-radius: 0.563rem;
  }