@use '@growi/core-styles/scss/bootstrap/init' as bs;

.btn-personal-dropdown :global {
  img {
    border: 2px solid var(--bs-border-color-translucent);
  }
}

.personal-dropdown-header :global {
  .item-text-email {
    font-size: 10.5px;
  }
}

.personal-dropdown-menu :global {
  --bs-dropdown-font-size: 14px;
}


// == Colors
@include bs.color-mode(light) {
  .personal-dropdown-header :global {
    color: var(--bs-gray-600);
  }

  .personal-dropdown-item :global {
    --bs-link-color-rgb:var(--bs-gray-600);

    color: var(--bs-gray-600);
  }
}

@include bs.color-mode(dark) {
  .personal-dropdown-header :global {
    color: var(--bs-gray-500);
  }

  .personal-dropdown-item :global {
    --bs-link-color-rgb:var(--bs-gray-500);

    color: var(--bs-gray-500);
  }
}