/* ============================================================================
   HRM Design System
   WMS Midnight Metal 디자인 토큰·컴포넌트를 그대로 차용.
   HRM 전용 오버라이드는 본 파일 하단에.
   ============================================================================ */

@import url('/wms/css/wms.css');

/* ─── HRM 식별 컬러 (로고 영역만) ────────────────────────────────────────── */
.wms-side__logo i.hrm-logo-ic {
  background: linear-gradient(135deg, #22d3ee 0%, #60a5fa 50%, #a78bfa 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ─── 페이지 헤드 부제: 데스크톱에서 노출 ───────────────────────────────── */
@media (min-width: 640px) {
  .wms-page-head__sub {
    display: block;
    font-size: 12px;
    color: var(--text-dim);
    margin-top: 4px;
  }
}

/* ─── HR Stat (KPI 카드 변형) — c-kpi에 hrm-stat 보조 클래스 ───────────── */
.c-kpi.hrm-stat--blue   { border-left: 3px solid var(--blue);   }
.c-kpi.hrm-stat--green  { border-left: 3px solid var(--green);  }
.c-kpi.hrm-stat--amber  { border-left: 3px solid var(--amber);  }
.c-kpi.hrm-stat--red    { border-left: 3px solid var(--red);    }
.c-kpi.hrm-stat--violet { border-left: 3px solid var(--violet); }
.c-kpi.hrm-stat--gold   { border-left: 3px solid var(--gold-light); }

/* ─── 이벤트 톤 (최근 활동 / 일정 등 공용 색 칩) ─────────────────────────── */
.hrm-tone-good    { color: var(--green); }
.hrm-tone-info    { color: var(--blue); }
.hrm-tone-warn    { color: var(--amber); }
.hrm-tone-crit    { color: var(--red); }
.hrm-tone-gold    { color: var(--gold-light); }
.hrm-tone-violet  { color: var(--violet); }

.hrm-tone-dot {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  vertical-align: middle;
}
.hrm-tone-dot.hrm-tone-good   { background: var(--green); }
.hrm-tone-dot.hrm-tone-info   { background: var(--blue); }
.hrm-tone-dot.hrm-tone-warn   { background: var(--amber); }
.hrm-tone-dot.hrm-tone-crit   { background: var(--red); }
.hrm-tone-dot.hrm-tone-gold   { background: var(--gold-light); }
.hrm-tone-dot.hrm-tone-violet { background: var(--violet); }
