:host {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: start;
  gap: 30px;

  width: fit-content;
  min-width: 100%;

  box-sizing: border-box;
  border-bottom: oklch(0 0 0 / 20%) 2px solid;
  background-color: oklch(1 0 0 / 60%);

  backdrop-filter: blur(20px);

  contain: layout paint;
  isolation: isolate;
  z-index: 100;

  .menu-left, .menu-right {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 48px;

    .menu-item, a:not(.settings) {
      /* 기존 span 스타일을 공통 클래스와 태그로 확장 */
      all: unset; /* 버튼 기본 스타일 제거 */
      font-size: 18px;
      height: 40px;
      align-content: center;
      vertical-align: middle;
      white-space: nowrap;
      font-family: inherit;
      color: inherit;
      cursor: pointer;
      display: flex;
      align-items: center;

      &.nav-link {
        font-weight: 700;
        color: oklch(0.5 0.15 250);
        transition: opacity 0.3s;

        &:hover {
          opacity: 0.7;
        }
      }

      strong {
        font-weight: 700;
      }
    }

    /* 구체적인 아이콘 예외 처리 */
    .icon-40 {
      height: auto;
    }
  }

  .menu-left {
    justify-content: start;
    padding: 12px;

    .brand {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: start;
      gap: 0;
      cursor: pointer;

      &:hover {
        opacity: 0.7;
      }

      img {
        display: inline-block;
        height: 20px;
        padding: 10px;
      }

      strong {
        font-weight: 900 !important;
      }

      span {
        /*text-box-trim: trim-both;
        text-box-edge: cap alphabetic;*/
      }
    }
  }

  .menu-right {
    flex-grow: 1;
    justify-content: flex-end;
    padding: 12px 20px;

    .settings {
      border: none;
      outline: none;
      background-color: inherit;
      padding: 0;

      position: relative;
      z-index: 10;
      cursor: pointer;
      transition: transform 0.3s ease;

      &:hover {
        transform: rotate(30deg);
      }
    }
  }
}