/* =============================================================
   직원관리 · 활동로그 — 맥 고밀도형 (사용자 2026-10-30 "1")
   범위: #users-content(머리 · 하위 탭 · 사용자 추가 · 필터 · 직원 표) · #activity_logs-content
   손대지 않음: 급여관리(#usr-payroll-panel) · 인센티브 추가조정율(#ae-incentive-adj-panel) — 금액 화면,
               가입신청 · 사수/리더 · 부서 · 연차취소이력 패널 안쪽(다음 차례)
   승인된 고밀도형 규칙: 제목 19px · 도구 28px · 표 행 28px · 머리 31px · 머리카락 선 · 휴대폰 44px.
   누르면 하는 일 · 정렬 · 필터 · 저장은 그대로. 퇴사 · 삭제 같은 뜻 있는 색은 글자색으로 유지.
   ============================================================= */
@media screen{
/* ---------- 공통 머리 ---------- */
html #users-content > div > .bg-white.rounded-lg, html #activity_logs-content > .container > .bg-white{ padding:16px 20px 20px !important; border:0 !important; border-radius:var(--ui-radius-card) !important; box-shadow:var(--ui-elev-raised) !important; background:var(--ui-surface) !important }
html #users-content h2, html #activity_logs-content h2{ font-size:var(--ui-text-title2) !important; font-weight:var(--ui-weight-semibold) !important; color:var(--ui-text-1) !important; letter-spacing:var(--ui-tracking-tight) }
html #users-content h2 > i, html #activity_logs-content h2 > i{ display:none !important }
html #users-content #usr-total-badge{ font-size:var(--ui-text-footnote) !important; color:var(--ui-text-2) !important; margin-left:6px !important }
html #users-content > div > .bg-white.rounded-lg > .flex:first-child{ margin-bottom:12px !important; gap:10px !important }
html #activity_logs-content > .container > .bg-white > .flex:first-child{ margin:0 0 12px !important; padding:0 !important; background:transparent !important; border:0 !important; min-height:0 !important }

/* 하위 탭 → 세그먼트 */
html #users-content #user-admin-tabs{ gap:0 !important; padding:2px; border-radius:var(--ui-radius-control); background:var(--ui-fill) }
html #users-content #user-admin-tabs > .user-admin-tab-btn{ height:24px; padding:0 10px !important; border:0 !important; border-radius:var(--ui-radius-row) !important; background:transparent !important; color:var(--ui-text-1) !important; box-shadow:none !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important; white-space:nowrap }
html #users-content #user-admin-tabs > .user-admin-tab-btn > i{ display:none !important }
/* 예전 탭 모양의 파란 밑줄(::after)은 세그먼트에서 안 씀 */
html #users-content #user-admin-tabs > .user-admin-tab-btn::after{ content:none !important; display:none !important }
html #users-content #user-admin-tabs > .user-admin-tab-btn.text-white{ background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; font-weight:var(--ui-weight-semibold) !important }
html #users-content #user-admin-tabs > .user-admin-tab-btn:not(.text-white):hover{ background:var(--ui-fill-hover) !important }

/* 단추: 사용자 추가만 채운 파랑, 나머지 흰 단추 */
html #users-content #usr-add-btn{ height:28px !important; padding:0 12px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background:var(--ui-accent) !important; color:var(--ui-on-accent) !important; box-shadow:none !important; font-size:var(--ui-text-callout) !important; font-weight:var(--ui-weight-semibold) !important; display:inline-flex; align-items:center }
html #users-content #usr-add-btn:hover{ background:var(--ui-accent-hover) !important }
html #users-content #usr-add-btn > i{ margin-right:6px !important; font-size:var(--ui-text-caption) }
html #activity_logs-content > .container > .bg-white > .flex:first-child > button, html #users-content #usr-f-reset{ height:28px !important; padding:0 12px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background:var(--ui-surface) !important; color:var(--ui-text-1) !important; box-shadow:var(--ui-elev-control) !important; font-size:var(--ui-text-callout) !important; font-weight:var(--ui-weight-regular) !important; display:inline-flex; align-items:center }
html #activity_logs-content > .container > .bg-white > .flex:first-child > button:hover, html #users-content #usr-f-reset:hover{ background:var(--ui-fill-hover) !important }
html #activity_logs-content > .container > .bg-white > .flex:first-child > button > i, html #users-content #usr-f-reset > i{ margin-right:6px !important; font-size:var(--ui-text-caption); color:var(--ui-text-2) }

/* 표를 감싼 칸이 테두리 · 그림자 · 여백을 한 겹 더 두르던 것(카드 안 카드) → 한 겹만 */
html #users-content #users-list, html #activity_logs-content #activity_logs-list{ padding:0 !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; background:transparent !important }
html #users-content > div > .bg-white.rounded-lg.shadow-md{ padding:16px 20px 20px !important }
/* ---------- 직원관리 필터 · 표 ---------- */
html #users-content #usr-filter-bar{ margin:0 0 10px !important; padding:0 !important; gap:6px !important; border:0 !important; background:transparent !important }
html #users-content #usr-filter-bar > .flex:first-child{ display:none !important }
html #users-content #usr-filter-bar select{ height:28px !important; padding:0 26px 0 10px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background-color:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-callout) !important }
html #users-content #usr-filter-bar select:focus{ outline:0; box-shadow:var(--ui-elev-control), var(--ui-focus-ring) !important }
html #users-content #usr-filter-count{ font-size:var(--ui-text-footnote) !important; color:var(--ui-text-2) !important }
html #users-content .users-table-wrap{ border:0 !important; border-radius:var(--ui-radius-group) !important; box-shadow:0 0 0 .5px var(--ui-line) !important; background:var(--ui-surface) !important }
html #users-content .users-admin-table{ font-family:var(--ui-font) }
html #users-content .users-admin-table thead th{ height:31px !important; padding:0 10px !important; border-bottom:0 !important; background:var(--ui-surface-alt) !important; box-shadow:inset 0 -.5px var(--ui-line) !important; color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important }
html #users-content .users-admin-table thead th .fa-sort{ opacity:0; transition:opacity var(--ui-dur-fast) var(--ui-ease) }
html #users-content .users-admin-table thead th:hover .fa-sort{ opacity:1 }
html #users-content .users-admin-table thead th :is(.fa-sort-up,.fa-sort-down){ color:var(--ui-accent) !important }
html #users-content .users-admin-table tbody td{ height:28px !important; padding:0 10px !important; border-bottom:0 !important; box-shadow:inset 0 -.5px var(--ui-line) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-callout) !important }
html #users-content .users-admin-table tbody tr:hover > td{ background:var(--ui-fill-subtle) !important }
/* 마우스 올린 줄: 고정된 첫 칸 · 작업 칸은 반투명 회색만 깔면 밑으로 지나가는 이메일이 비침(실제 마우스 확인에서 발견) → 흰 바탕 위에 회색 */
html #users-content .users-admin-table tbody tr:hover > td:is(:first-child,:last-child){ background:linear-gradient(var(--ui-fill-subtle), var(--ui-fill-subtle)), var(--ui-surface) !important }
html #users-content .users-admin-table tbody tr:is(.opacity-50,.usr-row-inactive) > td{ color:var(--ui-text-3) !important; background:var(--ui-surface-alt) !important }
html #users-content .users-admin-table tbody td span.rounded-full.bg-red-100{ padding:0 !important; background:transparent !important; color:var(--ui-danger) !important; font-size:var(--ui-text-caption) !important; font-weight:var(--ui-weight-semibold) !important }
/* 고정 첫 칸 · 작업 칸: 불투명 바탕(옆 칸 글자가 비치던 것) · 머리카락 선 */
html #users-content .users-admin-table :is(td,th):first-child{ background:var(--ui-surface) !important; box-shadow:inset -.5px 0 var(--ui-line), inset 0 -.5px var(--ui-line) !important }
html #users-content .users-admin-table td:first-child{ overflow:hidden; text-overflow:ellipsis }
html #users-content .users-admin-table thead th:first-child, html #users-content .users-admin-table thead th:last-child{ background:var(--ui-surface-alt) !important }
html #users-content .users-admin-table :is(td,th):last-child{ min-width:0 !important; background:var(--ui-surface) !important; box-shadow:inset .5px 0 var(--ui-line), inset 0 -.5px var(--ui-line) !important; text-align:center }
html #users-content .users-admin-table td:last-child{ padding:0 6px !important }
html #users-content .users-admin-table td:last-child button{ width:24px !important; height:24px !important; margin:0 1px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background:transparent !important; color:var(--ui-text-2) !important }
html #users-content .users-admin-table td:last-child button i{ font-size:var(--ui-text-footnote) !important }
html #users-content .users-admin-table td:last-child button:hover{ background:var(--ui-fill) !important; color:var(--ui-text-1) !important }
html #users-content .users-admin-table td:last-child button[data-action="resign"]:hover{ color:var(--ui-danger) !important }
html #users-content .users-admin-table td:last-child button[data-action="cancel-resign"]{ color:var(--ui-success) !important }

/* ---------- 활동로그 ---------- */
html #activity_logs-content > .container > .bg-white > .bg-gray-50{ margin:0 0 10px !important; padding:0 !important; background:transparent !important; border:0 !important }
html #activity_logs-content > .container > .bg-white > .bg-gray-50 > .grid{ display:flex !important; flex-wrap:wrap; gap:6px !important }
html #activity_logs-content > .container > .bg-white > .bg-gray-50 > .grid > div{ display:flex; align-items:center; gap:6px }
html #activity_logs-content > .container > .bg-white > .bg-gray-50 label{ margin:0 !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important; color:var(--ui-text-2) !important; white-space:nowrap }
html #activity_logs-content > .container > .bg-white > .bg-gray-50 label > i{ display:none !important }
html #activity_logs-content > .container > .bg-white > .bg-gray-50 :is(input,select){ width:auto !important; min-width:120px; height:28px !important; padding:0 10px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background-color:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-callout) !important }
html #activity_logs-content > .container > .bg-white > .bg-gray-50 select{ padding-right:26px !important }
html #activity_logs-content > .container > .bg-white > .bg-gray-50 :is(input,select):focus{ outline:0; box-shadow:var(--ui-elev-control), var(--ui-focus-ring) !important }
html #activity_logs-content #activity_logs-list > .overflow-x-auto{ border-radius:var(--ui-radius-group); box-shadow:0 0 0 .5px var(--ui-line); background:var(--ui-surface) }
html #activity_logs-content #activity_logs-list table{ border:0 !important; border-collapse:separate !important; border-spacing:0 !important; font-family:var(--ui-font) }
html #activity_logs-content #activity_logs-list thead{ background:transparent !important }
html #activity_logs-content #activity_logs-list th{ position:sticky; top:0; z-index:1; height:31px !important; padding:0 10px !important; border:0 !important; background:var(--ui-surface-alt) !important; box-shadow:inset 0 -.5px var(--ui-line) !important; color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important }
html #activity_logs-content #activity_logs-list td{ height:28px !important; padding:0 10px !important; border:0 !important; box-shadow:inset 0 -.5px var(--ui-line) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-callout) !important }
html #activity_logs-content #activity_logs-list td:first-child{ color:var(--ui-text-2) !important; font-variant-numeric:tabular-nums }
html #activity_logs-content #activity_logs-list tbody tr:hover > td{ background:var(--ui-fill-subtle) !important }
/* PC: 긴 설명이 표를 옆으로 밀던 것 → 남은 폭만큼 보이고 '…', 전체는 마우스 올리면(title). 휴대폰은 옆으로 밀기 그대로 */
@media (min-width:769px){
html #activity_logs-content #activity_logs-list table{ width:100% !important }
html #activity_logs-content #activity_logs-list td[data-col="desc"]{ width:100%; max-width:0; overflow:hidden; text-overflow:ellipsis }
}
/* 생성 · 수정 · 삭제 알약 → 색 점 + 글자(뜻 색 유지) */
html #activity_logs-content #activity_logs-list td > span.rounded{ display:inline-flex; align-items:center; gap:6px; padding:0 !important; background:transparent !important; font-size:var(--ui-text-callout) !important; color:var(--ui-text-1) !important }
html #activity_logs-content #activity_logs-list td > span.rounded::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--ui-text-3) }
html #activity_logs-content #activity_logs-list td > span.rounded.bg-green-100::before{ background:var(--ui-success) }
html #activity_logs-content #activity_logs-list td > span.rounded.bg-blue-100::before{ background:var(--ui-accent) }
html #activity_logs-content #activity_logs-list td > span.rounded.bg-red-100::before{ background:var(--ui-danger) }
}
@media screen and (max-width:768px){
html #users-content > div > .bg-white.rounded-lg, html #activity_logs-content > .container > .bg-white{ padding:12px !important }
html #users-content #user-admin-tabs{ flex-wrap:nowrap !important; overflow-x:auto; max-width:100%; scrollbar-width:none }
html #users-content .users-admin-table tbody td, html #activity_logs-content #activity_logs-list td{ height:44px !important }
html #users-content #usr-filter-bar select, html #activity_logs-content > .container > .bg-white > .bg-gray-50 :is(input,select){ height:36px !important }
html #activity_logs-content > .container > .bg-white > .bg-gray-50 > .grid > div{ flex:1 1 calc(50% - 6px) }
html #activity_logs-content > .container > .bg-white > .bg-gray-50 :is(input,select){ flex:1; min-width:0 }
}

/* =============================================================
   2. 나머지 패널 (사용자 2026-10-30 "나머지 패널 정리작업부터")
   가입신청(#user_requests-content) · 사수/리더(#um-mentor-panel) · 부서(#um-dept-panel) · 연차취소이력(#usr-leavehist-panel,#usr-emphist-panel)
   큰 제목 · 아이콘 · '관리자 전용' 알약 · 회색 상자 · 채운 색 단추 → 19px 제목 · 흰 묶음 · 흰 단추 · 뜻 색 글자.
   채운 파랑은 머리의 '사용자 추가' 하나뿐, 승인 · 거부 · 삭제는 초록 · 빨강 글자. 동작 그대로
   ============================================================= */
@media screen{
html #users-content :is(#um-mentor-panel,#um-dept-panel,#usr-leavehist-panel,#usr-emphist-panel) > .bg-white, html #user_requests-content > .bg-white{ padding:16px 20px 20px !important; border:0 !important; border-radius:var(--ui-radius-card) !important; box-shadow:var(--ui-elev-raised) !important; background:var(--ui-surface) !important }
html #users-content :is(#um-mentor-panel,#um-dept-panel,#usr-leavehist-panel,#usr-emphist-panel) h3, html #user_requests-content h2{ font-size:var(--ui-text-title3) !important; font-weight:var(--ui-weight-semibold) !important; color:var(--ui-text-1) !important }
html #users-content :is(#um-mentor-panel,#um-dept-panel,#usr-leavehist-panel,#usr-emphist-panel) > .bg-white > .flex:first-child > i, html #user_requests-content h2 > i{ display:none !important }
html #users-content :is(#um-mentor-panel,#um-dept-panel,#usr-leavehist-panel,#usr-emphist-panel) > .bg-white > .flex:first-child > span.rounded-full{ padding:0 !important; background:transparent !important; color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important }
html #users-content :is(#um-mentor-panel,#um-dept-panel,#usr-leavehist-panel,#usr-emphist-panel) > .bg-white > .flex:first-child{ margin-bottom:4px !important }
html #users-content :is(#um-dept-panel,#usr-leavehist-panel,#usr-emphist-panel) > .bg-white > p.text-xs{ margin-bottom:12px !important; color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important; line-height:var(--ui-leading) }
html #user_requests-content > .bg-white > .flex:first-child{ margin-bottom:12px !important }

/* 공통: 흰 단추 · 28px 입력 */
html #users-content :is(#um-mentor-panel,#um-dept-panel) :is(input[type="text"],select), html #users-content :is(#usr-leavehist-panel,#usr-emphist-panel) select{ height:28px !important; padding:0 10px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background-color:var(--ui-surface) !important; box-shadow:var(--ui-elev-field) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-callout) !important }
html #users-content :is(#um-mentor-panel,#um-dept-panel) select{ padding-right:26px !important }
html #users-content :is(#um-mentor-panel,#um-dept-panel) :is(input[type="text"],select):focus{ outline:0; box-shadow:var(--ui-elev-field), var(--ui-focus-ring) !important }

/* 가입신청: 상태 필터 → 세그먼트, 표 고밀도, 승인 · 거부는 글자 단추 */
html #user_requests-content > .bg-white > .flex:first-child > .flex{ gap:0 !important; padding:2px; border-radius:var(--ui-radius-control); background:var(--ui-fill) }
html #user_requests-content .req-filter-btn{ height:24px; padding:0 12px !important; border:0 !important; border-radius:var(--ui-radius-row) !important; background:transparent !important; color:var(--ui-text-1) !important; box-shadow:none !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important }
html #user_requests-content .req-filter-btn.text-white{ background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; font-weight:var(--ui-weight-semibold) !important }
html #user_requests-content #user-requests-list table{ border:0 !important; border-radius:var(--ui-radius-group) !important; box-shadow:0 0 0 .5px var(--ui-line); min-width:720px !important; font-family:var(--ui-font) }
html #user_requests-content #user-requests-list thead{ background:transparent !important }
html #user_requests-content #user-requests-list th{ height:31px !important; padding:0 10px !important; background:var(--ui-surface-alt) !important; box-shadow:inset 0 -.5px var(--ui-line); color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important; white-space:nowrap }
html #user_requests-content #user-requests-list td{ height:28px !important; padding:2px 10px !important; border:0 !important; box-shadow:inset 0 -.5px var(--ui-line); color:var(--ui-text-1) !important; font-size:var(--ui-text-callout) !important; white-space:nowrap }
html #user_requests-content #user-requests-list td.font-mono{ font-family:var(--ui-font-mono) !important; font-weight:var(--ui-weight-regular) !important }
html #user_requests-content #user-requests-list tbody tr{ border:0 !important }
html #user_requests-content #user-requests-list td button{ height:24px; padding:0 10px !important; margin:0 4px 0 0 !important; border:0 !important; border-radius:var(--ui-radius-row) !important; background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important }
html #user_requests-content #user-requests-list td button.bg-green-600{ color:var(--ui-success) !important }
html #user_requests-content #user-requests-list td button.bg-red-500{ color:var(--ui-danger) !important }
html #user_requests-content #user-requests-list td button:hover{ background:var(--ui-fill-hover) !important }

/* 상태 꼬리표(대기 · 승인 · 거부 · 반려) → 색 점 + 글자, 뜻 색 유지 */
html :is(#user_requests-content,#users-content) :is(#user-requests-list,#usr-leavehist-list) td span.rounded-full{ display:inline-flex; align-items:center; gap:6px; padding:0 !important; background:transparent !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-callout) !important; font-weight:var(--ui-weight-regular) !important }
html :is(#user_requests-content,#users-content) :is(#user-requests-list,#usr-leavehist-list) td span.rounded-full::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--ui-text-3) }
html :is(#user_requests-content,#users-content) :is(#user-requests-list,#usr-leavehist-list) td span.rounded-full.bg-yellow-100::before{ background:var(--ui-warning) }
html :is(#user_requests-content,#users-content) :is(#user-requests-list,#usr-leavehist-list) td span.rounded-full.bg-green-100::before{ background:var(--ui-success) }
html :is(#user_requests-content,#users-content) :is(#user-requests-list,#usr-leavehist-list) td span.rounded-full.bg-red-100::before{ background:var(--ui-danger) }

/* 사수/리더: 회색 상자 → 흰 묶음, 줄 28 · 44px, 저장 · 추가 단추 */
html #users-content #um-mentor-panel p.text-sm.font-bold{ margin-bottom:6px !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important; color:var(--ui-text-2) !important }
html #users-content #um-mentor-panel p.text-sm.font-bold > i{ display:none !important }
html #users-content #um-mentor-panel p.text-sm.font-bold > span{ color:var(--ui-text-3) !important; font-size:var(--ui-text-caption) !important }
html #users-content #um-mentor-panel .mb-6{ margin-bottom:16px !important }
html #users-content #um-mentor-panel :is(#um-leader-settings-wrap,#um-mentor-settings-wrap){ padding:4px 12px !important; border:0 !important; border-radius:var(--ui-radius-group) !important; background:var(--ui-surface) !important; box-shadow:0 0 0 .5px var(--ui-line) }
html #users-content #um-leader-settings-wrap > div{ min-height:36px; padding:4px 0 !important; border-bottom:0 !important; box-shadow:inset 0 -.5px var(--ui-line) }
html #users-content #um-leader-settings-wrap > div:last-child{ box-shadow:none }
html #users-content #um-leader-settings-wrap > div > span{ font-size:var(--ui-text-callout) !important; font-weight:var(--ui-weight-regular) !important; color:var(--ui-text-1) !important; width:96px !important }
html #users-content #um-leader-settings-wrap > div > select{ max-width:320px }
html #users-content #um-mentor-panel :is(#um-leader-settings-wrap,#um-mentor-settings-wrap) button.bg-blue-600{ height:24px; padding:0 12px !important; border:0 !important; border-radius:var(--ui-radius-row) !important; background:var(--ui-surface) !important; color:var(--ui-text-1) !important; box-shadow:var(--ui-elev-control) !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important }
html #users-content #um-mentor-settings-wrap > .overflow-x-auto{ margin-bottom:8px !important }
html #users-content #um-mentor-settings-wrap > .overflow-x-auto > .flex span.text-xs{ color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important }
html #users-content #um-mentor-settings-wrap button.text-orange-600{ height:24px; padding:0 10px !important; border:0 !important; border-radius:var(--ui-radius-row) !important; background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important }
html #users-content #um-mentor-settings-wrap button.text-orange-600 > i{ color:var(--ui-text-2) }
html #users-content #um-mentor-settings-wrap table thead tr{ background:transparent !important; border:0 !important }
html #users-content #um-mentor-settings-wrap th{ height:31px; padding:0 10px !important; background:var(--ui-surface-alt) !important; box-shadow:inset 0 -.5px var(--ui-line); color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important }
html #users-content #um-mentor-settings-wrap tbody{ border:0 !important }
html #users-content #um-mentor-settings-wrap td{ height:28px; padding:0 10px !important; box-shadow:inset 0 -.5px var(--ui-line); color:var(--ui-text-1) !important; font-size:var(--ui-text-callout) !important }
html #users-content #um-mentor-settings-wrap td button.text-red-400{ width:24px; height:24px; border-radius:var(--ui-radius-control); color:var(--ui-text-2) !important }
html #users-content #um-mentor-settings-wrap td button.text-red-400:hover{ background:var(--ui-fill) !important; color:var(--ui-danger) !important }
html #users-content #um-mentor-settings-wrap > div:not(.overflow-x-auto){ padding:8px 0 4px !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:inset 0 .5px var(--ui-line) }
html #users-content #um-mentor-settings-wrap > div:not(.overflow-x-auto) p{ color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important }
html #users-content #um-mentor-settings-wrap > div:not(.overflow-x-auto) p > i{ display:none !important }
html #users-content #um-mentor-settings-wrap > div:not(.overflow-x-auto) label{ color:var(--ui-text-2) !important; font-size:var(--ui-text-caption) !important; font-weight:var(--ui-weight-regular) !important }
html #users-content #um-mentor-settings-wrap > div:not(.overflow-x-auto) button.bg-blue-600{ height:28px !important; padding:0 14px !important; width:auto !important }

/* 부서: 부서 카드 → 흰 묶음, 파트는 회색 칩, 이름변경 · 삭제는 글자 단추, 부서 추가만 채운 파랑 */
html #users-content #um-dept-panel > .bg-white > .flex.p-3{ margin-bottom:12px !important; padding:0 !important; border:0 !important; background:transparent !important; gap:6px !important }
html #users-content #um-dept-panel > .bg-white > .flex.p-3 > input{ max-width:360px }
/* 머리의 '사용자 추가'가 이미 채운 파랑 → 부서 추가 · 페어링 추가는 흰 단추(화면당 채운 파랑 1개) */
html #users-content #um-dept-panel > .bg-white > .flex.p-3 > button{ height:28px !important; padding:0 12px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background:var(--ui-surface) !important; color:var(--ui-text-1) !important; box-shadow:var(--ui-elev-control) !important; font-size:var(--ui-text-callout) !important; font-weight:var(--ui-weight-regular) !important }
html #users-content #um-dept-panel > .bg-white > .flex.p-3 > button:hover{ background:var(--ui-fill-hover) !important }
html #users-content #dept-mgmt-list{ border-radius:var(--ui-radius-group); box-shadow:0 0 0 .5px var(--ui-line); background:var(--ui-surface); overflow:hidden }
html #users-content #dept-mgmt-list > * + *{ margin-top:0 !important }
html #users-content #dept-mgmt-list > div{ padding:10px 12px !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:inset 0 -.5px var(--ui-line) }
html #users-content #dept-mgmt-list > div:last-child{ box-shadow:none }
html #users-content #dept-mgmt-list > div > .flex:first-child{ margin-bottom:6px !important }
html #users-content #dept-mgmt-list > div > .flex:first-child i.fa-sitemap{ display:none !important }
html #users-content #dept-mgmt-list > div > .flex:first-child span.font-bold{ font-size:var(--ui-text-body) !important; font-weight:var(--ui-weight-semibold) !important; color:var(--ui-text-1) !important }
html #users-content #dept-mgmt-list > div > .flex:first-child span.text-xs{ color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important }
html #users-content #dept-mgmt-list > div > .flex:first-child button{ height:24px; padding:0 10px !important; border:0 !important; border-radius:var(--ui-radius-row) !important; background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-footnote) !important }
html #users-content #dept-mgmt-list > div > .flex:first-child button.text-red-500{ color:var(--ui-danger) !important }
html #users-content #dept-mgmt-list > div > .flex:first-child button i{ display:none !important }
html #users-content #dept-mgmt-list span.rounded-full{ height:22px; padding:0 4px 0 10px !important; border:0 !important; border-radius:var(--ui-radius-pill) !important; background:var(--ui-fill) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-footnote) !important }
html #users-content #dept-mgmt-list span.rounded-full button{ width:18px; height:18px; border-radius:50%; color:var(--ui-text-2) !important }
html #users-content #dept-mgmt-list span.rounded-full button:hover{ background:var(--ui-fill-hover) !important; color:var(--ui-danger) !important }
html #users-content #dept-mgmt-list > div > .flex:last-child > input{ max-width:300px; height:28px !important }
html #users-content #dept-mgmt-list > div > .flex:last-child > button{ height:24px; padding:0 10px !important; border:0 !important; border-radius:var(--ui-radius-row) !important; background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-footnote) !important }
html #users-content #dept-mgmt-list > div > .flex:last-child > button i{ display:none !important }

/* 연차취소이력: 상태 필터 → 세그먼트, 표 고밀도, 반려 메모는 같은 줄 */
html #users-content #usr-leavehist-list > .flex:first-child{ display:inline-flex !important; gap:0 !important; margin-bottom:10px !important; padding:2px; border-radius:var(--ui-radius-control); background:var(--ui-fill) }
html #users-content #usr-leavehist-list > .flex:first-child > button{ height:24px; padding:0 12px !important; border:0 !important; border-radius:var(--ui-radius-row) !important; background:transparent !important; color:var(--ui-text-1) !important; box-shadow:none !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important }
html #users-content #usr-leavehist-list > .flex:first-child > button.text-white{ background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; font-weight:var(--ui-weight-semibold) !important }
html #users-content #usr-leavehist-list > .flex:first-child > button span{ color:var(--ui-text-2); opacity:1 !important; margin-left:2px }
html #users-content :is(#usr-leavehist-list,#usr-emphist-list) > .overflow-x-auto{ border-radius:var(--ui-radius-group); box-shadow:0 0 0 .5px var(--ui-line); background:var(--ui-surface) }
html #users-content :is(#usr-leavehist-list,#usr-emphist-list) table{ font-family:var(--ui-font) }
html #users-content :is(#usr-leavehist-list,#usr-emphist-list) thead tr{ border:0 !important }
html #users-content :is(#usr-leavehist-list,#usr-emphist-list) th{ height:31px; padding:0 10px !important; background:var(--ui-surface-alt) !important; box-shadow:inset 0 -.5px var(--ui-line); color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important; font-weight:var(--ui-weight-regular) !important; white-space:nowrap }
html #users-content :is(#usr-leavehist-list,#usr-emphist-list) tbody tr{ border:0 !important }
html #users-content :is(#usr-leavehist-list,#usr-emphist-list) td{ height:28px; padding:0 10px !important; box-shadow:inset 0 -.5px var(--ui-line); color:var(--ui-text-1) !important; font-size:var(--ui-text-callout) !important; font-weight:var(--ui-weight-regular) !important; white-space:nowrap }
html #users-content #usr-leavehist-list td:nth-child(2), html #users-content #usr-leavehist-list td:nth-child(n+7){ color:var(--ui-text-2) !important }
html #users-content #usr-leavehist-list td > div.text-red-400{ display:inline !important; margin:0 0 0 6px !important; color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important }
/* 고용정보 변경이력: 직원 거르기 + 같은 고밀도 표. 바꾼 때 · 바꾼 사람 · 경로는 보조 글자색, 변경 값만 굵게 */
html #users-content #usr-emphist-list > .ufc-filter{ margin-bottom:10px !important }
html #users-content #usr-emphist-list > .ufc-filter > label, html #users-content #usr-emphist-list > .ufc-filter > span{ color:var(--ui-text-2) !important; font-size:var(--ui-text-footnote) !important }
html #users-content #usr-emphist-list #ufc-user{ max-width:220px; padding-right:26px !important }
html #users-content #usr-emphist-list .ufc-clip{ display:inline-block; max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle }
html #users-content #usr-emphist-list td:first-child, html #users-content #usr-emphist-list td:nth-child(n+6), html #users-content #usr-emphist-list td.ufc-before{ color:var(--ui-text-2) !important }
html #users-content #usr-emphist-list td.ufc-after{ font-weight:var(--ui-weight-semibold) !important }
html #users-content #usr-emphist-list > .ufc-empty{ padding:32px 0 !important; color:var(--ui-text-2) !important; font-size:var(--ui-text-callout) !important }
}
@media screen and (max-width:768px){
html #users-content :is(#um-mentor-panel,#um-dept-panel,#usr-leavehist-panel,#usr-emphist-panel) > .bg-white, html #user_requests-content > .bg-white{ padding:12px !important }
html :is(#user_requests-content,#users-content) :is(#user-requests-list,#usr-leavehist-list,#usr-emphist-list,#um-mentor-settings-wrap) td{ height:44px !important }
html #users-content :is(#usr-leavehist-list,#usr-emphist-list) > .overflow-x-auto, html #user_requests-content #user-requests-list > .overflow-x-auto{ overflow-x:auto }
html #users-content #usr-emphist-list td.ufc-name .ufc-clip{ max-width:88px }
html #users-content #usr-leavehist-list td:first-child, html #user_requests-content #user-requests-list td:nth-child(3){ position:sticky; left:0; z-index:1; background:var(--ui-surface) !important; box-shadow:inset -.5px 0 var(--ui-line), inset 0 -.5px var(--ui-line) }
html #users-content #um-dept-panel > .bg-white > .flex.p-3 > input, html #users-content #dept-mgmt-list > div > .flex:last-child > input{ max-width:none; height:36px !important }
}