/* ======================================================================== *
 * Copyright 2025 HCL America Inc.                                          *
 * Licensed under the Apache License, Version 2.0 (the "License");          *
 * you may not use this file except in compliance with the License.         *
 * You may obtain a copy of the License at                                  *
 *                                                                          *
 * http://www.apache.org/licenses/LICENSE-2.0                               *
 *                                                                          *
 * Unless required by applicable law or agreed to in writing, software      *
 * distributed under the License is distributed on an "AS IS" BASIS,        *
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. *
 * See the License for the specific language governing permissions and      *
 * limitations under the License.                                           *
 * ======================================================================== */

@use "sass:map";
@use "../../common/palette";
@use "../../common/themeMap.module";
@use "../../common/typography";

@mixin enchanted-menu-item-base-styles {
  &::part(text-root) {
    margin-left: 16px;
    margin-right: 8px;
    margin-top: 0px;
    margin-bottom: 0px;
    flex: 1 1 auto;
    min-width: 0px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  &::part(text) {
    overflow: hidden;
    pointer-events: none;
    position: relative;
    z-index: 0;
    inset: 0px;
    border-radius: inherit;
  }

  &::part(menu-item) {
    @include typography.body1;
    border: 1px solid transparent;
    padding: 5px 0px;
    min-height: 36px;
    -webkit-tap-highlight-color: transparent;
    background-color: transparent;
    outline: 0px;
    margin: 0px;
    border-radius: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    color: inherit;
    -webkit-box-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    align-items: center;
    position: relative;
    text-decoration: none;
    box-sizing: border-box;
    white-space: nowrap;
    display: flex;
  }

  &::part(menu-item):hover {
    background-color: palette.clr(light, action, hover);
  }

  &::part(menu-item):focus {
    border: 1px solid map.get(themeMap.$enchantedPalette, HCLSOFTWAREBLUE06);
  }
}