/* 콘솔 사이드바 즐겨찾기(빠른메뉴) — js/consoleMenuFavorites.js 가 그린다.
 *
 * 테넌트 관리자의 css/components/admin-menu-favorites.css 와 같은 자리다.
 * ★ console-admin.css 에 얹지 않고 별도 파일로 둔다 — 그 파일은 테마·대비 보정으로
 *   자주 손대는 곳이라, 남의 손질과 겹치면 이 블록이 통째로 사라진다(실제로 한 번 사라졌다).
 *
 * 사이드바는 라이트/다크와 무관하게 항상 어두우므로(aside data-bs-theme="dark")
 * 여기서는 흰색 알파를 쓴다.
 */

/* 최상단 즐겨찾기 섹션 */
.wm-fav-section {
    padding-bottom: .5rem;
    margin-bottom: .25rem;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.wm-fav-title {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .5rem 1.5rem .25rem;
    font-size: .7rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .45);
}

.wm-fav-title .fa-star {
    color: #f59f00;
    font-size: .65rem;
}

.wm-fav-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.wm-fav-item {
    cursor: grab;
}

.wm-fav-item.dragging {
    opacity: .4;
}

/* 별(★) 토글 — 각 메뉴 항목의 오른쪽 끝. 평소에는 숨고 hover 에서만 드러난다.
   ★ 이 규칙이 없으면 브라우저 기본 버튼(회색 면 + outset 테두리)이 그대로 보인다. */
.wm-fav-host {
    position: relative;
    padding-right: 2.25rem !important;
}

.wm-fav-toggle {
    position: absolute;
    top: 50%;
    right: .625rem;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .125rem;
    border: 0;
    background: transparent;
    color: inherit;
    font-size: .8em;
    line-height: 1;
    opacity: 0;
    cursor: pointer;
    transition: opacity .15s ease;
}

a:hover > .wm-fav-toggle,
.wm-fav-toggle:focus-visible {
    opacity: .55;
}

.wm-fav-toggle:hover {
    opacity: 1;
}

.wm-fav-toggle.is-active {
    color: #f59f00;
}

/* 즐겨찾기 섹션 안의 항목은 채워진 별을 항상 보여 준다(제거 입구가 거기뿐이다) */
.wm-fav-list .wm-fav-toggle.is-active {
    opacity: .85;
}

a:hover > .wm-fav-toggle.is-active,
.wm-fav-toggle.is-active:hover {
    opacity: 1;
}

/* 터치 기기에는 hover 가 없으므로 항상 은은하게 노출 */
@media (hover: none) {
    .wm-fav-toggle {
        opacity: .35;
    }
}