/* =============================================================================
   ZeroDesk · Apple Design System override · v2
   ── 1단계 (홈/사이드바/잠금) + 풀 레이아웃 (사이드바 232px, 페이지 헤더)
   ============================================================================= */

/* ──────────────────────────────────────────────────────────────────────────
   0. 전역 토큰
   ────────────────────────────────────────────────────────────────────────── */
:root {
  --sidebar-w: 232px !important;
  --accent: #0066cc;
  --accent-hover: #0058b0;
  --focus-blue: #0071e3;
  --sidebar-bg: #ffffff;
  --warning: #cf832f;
  --text-soft: rgba(0, 0, 0, 0.56);
  --text-muted: rgba(0, 0, 0, 0.4);
  --hairline: rgba(0, 0, 0, 0.08);
  --hairline-faint: rgba(0, 0, 0, 0.04);
}

body.app-layout {
  background: #f5f5f7;
  -webkit-font-smoothing: antialiased;
  letter-spacing: -0.01em;
}

/* ──────────────────────────────────────────────────────────────────────────
   1. 사이드바 (232px 폭, 가로형 nav)
   ────────────────────────────────────────────────────────────────────────── */
#app-sidebar {
  width: 232px !important;
  background: #ffffff !important;
  border-right: 1px solid var(--hairline);
  padding: 18px 14px !important;
  align-items: stretch !important;
  gap: 0 !important;
}

.sidebar-top {
  align-items: stretch !important;
  padding: 0 !important;
  gap: 1px !important;
  flex: 1;
}

.sidebar-bottom {
  align-items: stretch !important;
  padding: 12px 0 0 !important;
  gap: 6px !important;
  border-top: 1px solid var(--hairline);
}

/* 로고 영역 — ZD 마크 + 워드마크 */
.sidebar-logo {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 8px !important;
  background: #1d1d1f !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  margin: 0 !important;
  padding: 0 !important;
  flex-shrink: 0;
}

.sidebar-brand-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 8px 18px !important;
}

.sidebar-wordmark {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: #1d1d1f;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
}
.sidebar-wordmark span {
  font-weight: 300;
  color: var(--text-muted);
}

/* 섹션 라벨 (구분선 → 라벨로 전환) */
.sidebar-sep {
  background: transparent !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 14px 10px 6px !important;
  font-family: var(--font-text);
  font-size: 11px !important;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  text-align: left !important;
}

/* 첫 sep (운영) 위 여백 줄이기 */
.sidebar-top > .sidebar-sep:first-of-type {
  padding-top: 0 !important;
}

/* 가로형 nav 버튼 */
.sidebar-nav-btn {
  flex-direction: row !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 10px !important;
  width: 100% !important;
  height: 36px !important;
  padding: 0 10px !important;
  border-radius: 8px !important;
  color: rgba(0, 0, 0, 0.65) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  letter-spacing: -0.01em !important;
  transition: background .15s, color .15s, transform .12s;
  text-align: left;
}
.sidebar-nav-btn svg {
  width: 18px !important;
  height: 18px !important;
  stroke-width: 1.6 !important;
  flex-shrink: 0;
}
.sidebar-nav-label {
  font-size: 14px !important;
  font-weight: 400 !important;
  letter-spacing: -0.01em !important;
  color: inherit !important;
  margin: 0 !important;
  text-align: left !important;
}
.sidebar-nav-btn:hover {
  background: #f5f5f7 !important;
  color: #1d1d1f !important;
}
.sidebar-nav-btn:active {
  transform: scale(0.98);
}
.sidebar-nav-btn.active {
  background: #f5f5f7 !important;
  color: #0066cc !important;
  box-shadow: none !important;
}
.sidebar-nav-btn.active svg {
  stroke: #0066cc !important;
}
.sidebar-nav-btn.active .sidebar-nav-label {
  color: #0066cc !important;
  font-weight: 600 !important;
}

/* 알림 뱃지 — 우측 정렬 */
.sidebar-nav-btn .tab-nav-unread-badge {
  position: static !important;
  margin-left: auto !important;
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
  font-weight: 600 !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 6px !important;
  font-size: 11px !important;
  line-height: 18px !important;
  border-radius: 980px !important;
}

/* 사용자 영역 */
.sidebar-user {
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 6px 8px !important;
  border-radius: 10px;
  width: auto !important;
}
.sidebar-avatar {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: linear-gradient(180deg, #3a3a3c, #1d1d1f) !important;
  color: #fff !important;
  border: 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  flex-shrink: 0;
}
.sidebar-avatar--mypage:hover {
  background: linear-gradient(180deg, #4a4a4c, #2a2a2c) !important;
}

.sidebar-role {
  font-size: 11px !important;
  color: var(--text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-weight: 500;
}
.sidebar-role:empty::before {
  content: "직원";
  color: var(--text-muted);
}

.sidebar-logout-btn {
  margin-left: auto !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  color: rgba(0, 0, 0, 0.4) !important;
  flex-shrink: 0;
}
.sidebar-logout-btn:hover {
  background: #f5f5f7 !important;
  color: #1d1d1f !important;
}
.sidebar-logout-btn svg { width: 14px !important; height: 14px !important; }

.sidebar-clinic-logo { display: none !important; }

/* ──────────────────────────────────────────────────────────────────────────
   2. 페이지 헤더 (홈 화면 상단 그리팅)
   ────────────────────────────────────────────────────────────────────────── */
.apple-page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 28px 28px 4px;
  flex-wrap: wrap;
}
.apple-page-head-left { min-width: 0; }
.apple-page-head h1 {
  font-family: var(--font-display);
  font-size: 32px;
  font-weight: 600;
  letter-spacing: -0.022em;
  line-height: 1.15;
  margin: 0;
  color: #1d1d1f;
}
.apple-page-head h1 em {
  font-style: normal;
  font-weight: 300;
  color: var(--text-muted);
}
.apple-page-head-sub {
  margin-top: 6px;
  font-size: 14px;
  color: var(--text-soft);
  letter-spacing: -0.01em;
}
.apple-page-head-actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}
.apple-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 18px;
  border-radius: 980px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.01em;
  cursor: pointer;
  transition: background .15s, transform .12s;
  border: 0;
  font-family: inherit;
}
.apple-btn:active { transform: scale(0.96); }
.apple-btn--blue { background: #0066cc; color: #fff; }
.apple-btn--blue:hover { background: #0058b0; }
.apple-btn--ghost {
  background: #ffffff;
  color: #1d1d1f;
  border: 1px solid var(--hairline);
}
.apple-btn--ghost:hover { background: #f5f5f7; }

/* ──────────────────────────────────────────────────────────────────────────
   3. 잠금화면
   ────────────────────────────────────────────────────────────────────────── */
#lockScreen { background: #ffffff !important; }
.lock-divider { background: var(--hairline) !important; height: 1px !important; }
.lock-field-label {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--text-soft) !important;
  letter-spacing: -0.01em !important;
  padding-left: 14px;
}
.lock-input, .lock-input-auth {
  background: #f5f5f7 !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  height: 46px !important;
  padding: 0 18px !important;
  font-size: 15px !important;
  letter-spacing: -0.01em !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
  opacity: 1 !important;
}
.lock-input::placeholder, .lock-input-auth::placeholder {
  color: rgba(0,0,0,0.32) !important;
  -webkit-text-fill-color: rgba(0,0,0,0.32) !important;
}
.lock-input:focus, .lock-input-auth:focus {
  background: #fff !important;
  border-color: var(--focus-blue) !important;
  outline: none !important;
}
.lock-btn {
  background: #0066cc !important;
  color: #fff !important;
  height: 46px !important;
  border-radius: 980px !important;
  font-size: 15px !important;
  font-weight: 500 !important;
}
.lock-btn:hover { background: #0058b0 !important; }
.lock-btn:active { transform: scale(0.98); }
.lock-error { color: #c54a3a !important; font-size: 12px !important; }
.logo.lock-screen-wordmark { color: var(--text-muted) !important; letter-spacing: 0.3em !important; }
.logo .logo-zero { font-weight: 300 !important; }
.logo .logo-desk { font-weight: 500 !important; }

/* ──────────────────────────────────────────────────────────────────────────
   4. 홈 — 카드/패널/타이포
   ────────────────────────────────────────────────────────────────────────── */
.dashboard-page { background: #f5f5f7 !important; padding-top: 0 !important; }

#dashboardBirthdayBanner.dashboard-birthday-banner {
  background: #ffffff !important;
  color: #1d1d1f !important;
  border: 1px solid var(--hairline);
  border-left: 3px solid #0066cc;
  border-radius: 14px !important;
  box-shadow: none !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em;
  margin: 16px 28px 0 !important;
}

/* KPI 카드 */
.dashboard-cards {
  padding: 16px 28px 0 !important;
  gap: 16px !important;
}
.dashboard-card {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  padding: 22px 24px 20px !important;
  box-shadow: none !important;
}
.dashboard-card::before { display: none !important; }
.dashboard-card-label {
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--text-soft) !important;
  margin-bottom: 12px !important;
  text-transform: none !important;
  letter-spacing: -0.01em !important;
}
.dashboard-card-value-row { align-items: baseline; gap: 6px !important; }
.dashboard-card-value {
  font-size: 40px !important;
  font-weight: 600 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.0 !important;
  font-variant-numeric: tabular-nums;
  color: #1d1d1f !important;
}
.dashboard-card:nth-child(1) .dashboard-card-value,
.dashboard-card:nth-child(3) .dashboard-card-value { color: #1d1d1f !important; }
.dashboard-card-unit {
  font-size: 14px !important;
  color: var(--text-soft) !important;
  margin-left: 2px !important;
  letter-spacing: -0.01em !important;
}

/* 패널 */
.dashboard-mid, .dashboard-bottom {
  padding-left: 28px !important;
  padding-right: 28px !important;
  padding-top: 16px !important;
  gap: 16px !important;
}
.dashboard-panel {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  padding: 24px !important;
  box-shadow: none !important;
}
.dashboard-panel-title {
  font-family: var(--font-display);
  font-size: 17px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  color: #1d1d1f !important;
  margin-bottom: 18px !important;
}
.dashboard-subheading {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #1d1d1f !important;
  text-transform: none !important;
  letter-spacing: -0.01em !important;
  margin-top: 18px !important;
  margin-bottom: 8px !important;
}
.dashboard-hint {
  font-size: 12px !important;
  color: var(--text-muted) !important;
  letter-spacing: -0.01em !important;
}
.dashboard-today-scroll { border: 0 !important; border-radius: 0 !important; }

/* 테이블 */
.dashboard-table { font-size: 14px !important; letter-spacing: -0.01em; }
.dashboard-table th, .dashboard-table thead th {
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: var(--text-muted) !important;
  padding: 10px 14px !important;
  border-bottom: 1px solid var(--hairline) !important;
  background: transparent !important;
}
.dashboard-table td {
  padding: 14px !important;
  border-bottom: 1px solid var(--hairline-faint) !important;
  color: #1d1d1f !important;
}
.dashboard-table tbody tr:last-child td { border-bottom: 0 !important; }
.dashboard-table tr:hover td { background: rgba(245, 245, 247, 0.5) !important; }

/* 공지사항 */
.dashboard-notice-item {
  border: 1px solid var(--hairline) !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  padding: 14px 16px !important;
  margin-bottom: 10px !important;
}
.dashboard-notice-meta { font-size: 12px !important; color: var(--text-muted) !important; margin-bottom: 6px !important; }
.dashboard-notice-who { font-weight: 600 !important; color: var(--text-soft) !important; }
.dashboard-notice-when { color: var(--text-muted) !important; }
.dashboard-notice-body {
  font-size: 14px !important;
  color: #1d1d1f !important;
  letter-spacing: -0.01em !important;
  line-height: 1.55 !important;
}
.dashboard-notice-input {
  border: 1px solid var(--hairline) !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  background: #fff !important;
  letter-spacing: -0.01em !important;
}
.dashboard-notice-input:focus {
  border-color: var(--focus-blue) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* 공지/팀캘 공통 — 인디고 등록/저장 버튼 → Apple 블루 알약 */
.btn-teamcal-primary,
.btn-settings-primary,
.btn-messenger-notice,
.btn-messenger-send,
.btn-messenger-create-submit,
.btn-inventory-detail-save,
.btn-inventory-add-item-save,
.btn-stock-print,
.btn-save-cal,
.cost-btn-analyze {
  background: #0066cc !important;
  color: #fff !important;
  border-radius: 980px !important;
  border: 0 !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  box-shadow: none !important;
  transition: background .15s, transform .12s !important;
}
.btn-teamcal-primary:hover,
.btn-settings-primary:hover,
.btn-messenger-notice:hover,
.btn-messenger-send:hover,
.btn-messenger-create-submit:hover,
.btn-inventory-detail-save:hover,
.btn-inventory-add-item-save:hover,
.btn-stock-print:hover,
.btn-save-cal:hover,
.cost-btn-analyze:hover { background: #0058b0 !important; }
.btn-teamcal-primary:active,
.btn-settings-primary:active { transform: scale(0.96); }

.btn-teamcal-secondary,
.btn-settings-secondary,
.btn-messenger-create-cancel,
.btn-inventory-detail-cancel,
.btn-inventory-add-item-cancel,
.btn-cancel {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  color: #1d1d1f !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  box-shadow: none !important;
}

/* 일정 패널 */
.dashboard-team-sched {
  margin: 16px 28px 0 !important;
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  padding: 22px 24px !important;
  box-shadow: none !important;
}
.dashboard-team-sched-item {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
  box-shadow: none !important;
}
.dashboard-team-sched-type {
  border-radius: 980px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  padding: 3px 10px !important;
  text-transform: none !important;
}
.dashboard-team-sched-type--off { background: rgba(197,74,58,0.10) !important; color: #c54a3a !important; }
.dashboard-team-sched-type--annual { background: rgba(139,109,195,0.10) !important; color: #8b6dc3 !important; }
.dashboard-team-sched-type--vacation,
.dashboard-team-sched-type--half { background: rgba(207,131,47,0.10) !important; color: #cf832f !important; }
.dashboard-team-sched-name { font-size: 15px !important; font-weight: 600 !important; color: #1d1d1f !important; letter-spacing: -0.01em !important; }
.dashboard-team-sched-meta { font-size: 12px !important; color: var(--text-muted) !important; }

/* 가동률 막대 */
.dashboard-month-block {
  border-bottom: 1px solid var(--hairline) !important;
  padding-bottom: 14px !important;
  margin-bottom: 14px !important;
}
.dashboard-month-line { font-size: 14px !important; color: var(--text-soft) !important; letter-spacing: -0.01em !important; }
.dashboard-month-line strong { color: #1d1d1f !important; font-weight: 600 !important; }
.dashboard-table--compact th,
.dashboard-table--compact td { font-size: 13px !important; padding: 10px 14px !important; }

/* ──────────────────────────────────────────────────────────────────────────
   5. 모바일 nav · 토스트
   ────────────────────────────────────────────────────────────────────────── */
#mobile-bottom-nav, .mobile-nav {
  background: rgba(255,255,255,0.86) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
  backdrop-filter: saturate(180%) blur(20px) !important;
  border-top: 1px solid var(--hairline) !important;
}
.mobile-nav-btn, #mobile-bottom-nav .mobile-nav-btn { color: rgba(0,0,0,0.5) !important; }
.mobile-nav-btn.active, #mobile-bottom-nav .mobile-nav-btn.active { color: #0066cc !important; }

.toast {
  background: rgba(29,29,31,0.92) !important;
  color: #fff !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  letter-spacing: -0.01em !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

/* ──────────────────────────────────────────────────────────────────────────
   6. 마이페이지 모달 · 남은 인디고 버튼 일괄 정리
   ────────────────────────────────────────────────────────────────────────── */
.mypage-section-title,
.modal-section-title { color: #0066cc !important; }

/* 인디고 채움 버튼 → Apple 블루 알약 (모달 저장, 일반 primary) */
.mypage-save-btn,
.mypage-modal .btn-primary,
.modal .btn-primary,
button.btn-primary,
.btn-save,
.btn-submit,
[class*="-save-btn"],
[class*="-submit-btn"] {
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 980px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  box-shadow: none !important;
  transition: background .15s, transform .12s !important;
}
.mypage-save-btn:hover,
.mypage-modal .btn-primary:hover,
.modal .btn-primary:hover,
button.btn-primary:hover,
.btn-save:hover,
.btn-submit:hover { background: #0058b0 !important; }
.mypage-save-btn:active,
button.btn-primary:active { transform: scale(0.96); }

/* 모달 입력란 — 텍스트 확실히 보이게 */
.mypage-modal input,
.modal input[type="text"],
.modal input[type="password"],
.modal input[type="tel"],
.modal input[type="email"] {
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
}
.mypage-modal input:focus,
.modal input:focus {
  border-color: var(--focus-blue) !important;
  outline: none !important;
}

/* ============================================================================
   PHASE 2 · 예약 (캘린더)
   ── 룸×시간 그리드 · 미배정 사이드 · 예약 모달
   ============================================================================ */

/* ── 상단 범례 바 ──────────────────────────────────────────────────────── */
#page-calendar .legend-bar-cal {
  background: #ffffff !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 14px 28px !important;
  gap: 16px !important;
  align-items: center !important;
}
#page-calendar .leg {
  font-size: 12px !important;
  color: var(--text-soft) !important;
  font-weight: 400 !important;
  gap: 6px !important;
}
#page-calendar .leg-dot { width: 8px !important; height: 8px !important; }

/* 우측 날짜/통계 컨트롤 */
.cal-date-controls {
  margin-left: auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
#page-calendar .stat {
  font-size: 13px !important;
  color: var(--text-soft) !important;
  letter-spacing: -0.01em !important;
}
#page-calendar .stat strong { color: #1d1d1f !important; font-weight: 600 !important; }

.cal-arr {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  color: #1d1d1f !important;
  font-size: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  transition: background .15s !important;
}
.cal-arr:hover { background: #f5f5f7 !important; color: #1d1d1f !important; }

.cal-date-lbl, #page-calendar .cal-date-lbl {
  font-family: var(--font-display);
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  color: #1d1d1f !important;
  min-width: 150px !important;
  text-align: center !important;
}

.cal-today-btn {
  height: 32px !important;
  padding: 0 14px !important;
  border-radius: 980px !important;
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  color: #1d1d1f !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  transition: background .15s !important;
}
.cal-today-btn:hover { background: #f5f5f7 !important; }

.cal-add-btn, #page-calendar .cal-add-btn {
  height: 32px !important;
  padding: 0 16px !important;
  border-radius: 980px !important;
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  box-shadow: none !important;
  transition: background .15s, transform .12s !important;
}
.cal-add-btn:hover { background: #0058b0 !important; }
.cal-add-btn:active { transform: scale(0.96); }

/* ── 미배정 사이드 ─────────────────────────────────────────────────────── */
#page-calendar .cal-main-row .sidebar {
  width: 232px !important;
  background: #ffffff !important;
  border-right: 1px solid var(--hairline) !important;
  padding: 0 !important;
}
#page-calendar .sb-head {
  padding: 18px 18px 12px !important;
  border-bottom: 1px solid var(--hairline) !important;
}
#page-calendar .sb-title {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  color: #1d1d1f !important;
}
#page-calendar .sb-count {
  font-size: 12px !important;
  color: var(--text-muted) !important;
  margin-top: 3px !important;
}
#page-calendar .sb-list { padding: 12px !important; }

.mini-card {
  background: #f5f5f7 !important;
  border: 0 !important;
  border-left: 3px solid #c7c7cc !important;
  border-radius: 10px !important;
  padding: 12px 12px 11px !important;
  margin-bottom: 8px !important;
  transition: background .12s !important;
}
.mini-card:hover { background: #efeff1 !important; }
.mini-name { font-size: 13px !important; font-weight: 600 !important; color: #1d1d1f !important; letter-spacing: -0.01em !important; }
.mini-treat { font-size: 12px !important; color: var(--text-soft) !important; margin-bottom: 8px !important; }
.mini-ch {
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  padding: 2px 8px !important;
  border-radius: 980px !important;
  background: rgba(0,0,0,0.05) !important;
  color: var(--text-soft) !important;
}
.mini-dur { font-size: 11px !important; color: var(--text-muted) !important; }

/* ── 그리드 헤더 (코너 + 룸) — 네이비 → 화이트 ─────────────────────────── */
.corner, #page-calendar .corner {
  background: rgba(245,245,247,0.85) !important;
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  backdrop-filter: saturate(180%) blur(12px);
  border-right: 1px solid var(--hairline-faint) !important;
  border-bottom: 1px solid var(--hairline) !important;
}
.corner span {
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  color: var(--text-muted) !important;
}
.room-hd, #page-calendar .room-hd {
  background: rgba(245,245,247,0.85) !important;
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  backdrop-filter: saturate(180%) blur(12px);
  border-right: 1px solid var(--hairline-faint) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 12px !important;
}
.room-hd-name {
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: #1d1d1f !important;
}
.room-hd-name.vip { color: #0066cc !important; }
.room-hd-count {
  font-size: 11px !important;
  color: var(--text-muted) !important;
  margin-top: 3px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* ── 시간 라벨 · 슬롯 ──────────────────────────────────────────────────── */
.t-lbl {
  background: #ffffff !important;
  border-right: 1px solid var(--hairline) !important;
  border-bottom: 1px solid var(--hairline-faint) !important;
  color: var(--text-muted) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  font-variant-numeric: tabular-nums;
}
.slot {
  border-right: 1px solid var(--hairline-faint) !important;
  border-bottom: 1px solid var(--hairline-faint) !important;
}
.slot:hover { background: rgba(0,102,204,0.04) !important; }
.slot.half { border-bottom: 1px dashed rgba(0,0,0,0.04) !important; }
.slot.drop-target {
  background: rgba(0,102,204,0.08) !important;
  outline: 2px dashed #0066cc !important;
  outline-offset: -2px !important;
}

/* ── 예약 블록 — 솔리드 컬러 유지, 형태만 Apple ────────────────────────── */
.appt-blk {
  border-radius: 9px !important;
  padding: 7px 10px !important;
  box-shadow: none !important;
}
.appt-blk:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,0.16) !important;
}
.ab-name { font-size: 12px !important; font-weight: 600 !important; letter-spacing: -0.01em !important; }
.ab-treat { font-size: 10px !important; letter-spacing: -0.01em !important; }

/* ── 예약 모달 ─────────────────────────────────────────────────────────── */
#calOverlay.overlay { background: rgba(0,0,0,0.32) !important; -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); }
#calOverlay .modal {
  border-radius: 20px !important;
  border: 1px solid var(--hairline) !important;
  box-shadow: 0 24px 64px rgba(0,0,0,0.22) !important;
  padding: 28px !important;
}
.modal-title-cal {
  font-family: var(--font-display);
  font-size: 20px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  color: #1d1d1f !important;
  margin-bottom: 18px !important;
}
#calOverlay .f-grp label {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--text-soft) !important;
  letter-spacing: -0.01em !important;
  padding-left: 2px !important;
}
#calOverlay input,
#calOverlay select,
#calOverlay textarea {
  border: 1px solid var(--hairline) !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
  background: #ffffff !important;
  letter-spacing: -0.01em !important;
}
#calOverlay input:focus,
#calOverlay select:focus,
#calOverlay textarea:focus {
  border-color: var(--focus-blue) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(0,113,227,0.12) !important;
}
.cal-treat-total { font-size: 13px !important; color: var(--text-soft) !important; }
.cal-treat-total strong { color: #1d1d1f !important; font-weight: 600 !important; }

.m-actions { gap: 10px !important; margin-top: 8px !important; }
.btn-save-cal {
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 980px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  box-shadow: none !important;
  padding: 0 20px !important;
  height: 38px !important;
  transition: background .15s, transform .12s !important;
}
.btn-save-cal:hover { background: #0058b0 !important; }
.btn-save-cal:active { transform: scale(0.96); }
.btn-cancel {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  color: #1d1d1f !important;
  font-weight: 500 !important;
  height: 38px !important;
  padding: 0 18px !important;
}
.btn-cancel:hover { background: #f5f5f7 !important; }
.btn-del {
  background: #ffffff !important;
  border: 1px solid rgba(197,74,58,0.3) !important;
  border-radius: 980px !important;
  color: #c54a3a !important;
  font-weight: 500 !important;
  height: 38px !important;
  padding: 0 18px !important;
  margin-right: auto !important;
}
.btn-del:hover { background: rgba(197,74,58,0.06) !important; }

/* ============================================================================
   PHASE 3 · 공통 페이지 타이틀 / 서브탭 / 테이블
   ============================================================================ */
.stock-page, .inventory-page, .closing-page, .team-page,
.teamcal-page, .cost-page-wrap, .settings-page {
  background: #f5f5f7 !important;
}
.closing-title, .team-page-title, .teamcal-page-title,
.settings-page-title, .cost-page-title, .stock-logs-title,
.inventory-cart-title, .inventory-history-title {
  font-family: var(--font-display);
  letter-spacing: -0.022em !important;
  color: #1d1d1f !important;
}
.team-page-title, .teamcal-page-title, .settings-page-title,
.cost-page-title, .closing-title {
  font-size: 30px !important;
  font-weight: 600 !important;
}

/* 공통 테이블 (stock/inventory/settings) */
.stock-table, .stock-logs-table, .inventory-table, .settings-table {
  font-size: 13px !important;
  letter-spacing: -0.01em !important;
  border-collapse: collapse !important;
}
.stock-table thead th, .stock-logs-table thead th,
.inventory-table thead th, .settings-table thead th {
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--text-muted) !important;
  background: rgba(245,245,247,0.6) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 12px 14px !important;
}
.stock-table tbody td, .stock-logs-table tbody td,
.inventory-table tbody td, .settings-table tbody td {
  padding: 13px 14px !important;
  border-bottom: 1px solid var(--hairline-faint) !important;
  color: #1d1d1f !important;
}
.stock-table tbody tr:hover td, .inventory-table tbody tr:hover td,
.settings-table tbody tr:hover td { background: rgba(245,245,247,0.5) !important; }
.stock-table-wrap, .stock-logs-table-wrap, .inventory-table-wrap,
.settings-table-wrap {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 16px !important;
  overflow: auto !important;
  box-shadow: none !important;
}

/* ============================================================================
   PHASE 3a · 재고 (STOCK)
   ============================================================================ */
.stock-toolbar { padding: 24px 28px 16px !important; gap: 14px !important; align-items: center !important; }
.stock-team-tabs {
  display: inline-flex !important;
  padding: 3px !important;
  background: #e9e9ed !important;
  border-radius: 980px !important;
  gap: 2px !important;
}
.stock-team-tab.btn-teamcal-primary, .stock-team-tab {
  background: transparent !important;
  color: var(--text-soft) !important;
  border: 0 !important;
  border-radius: 980px !important;
  height: 30px !important;
  padding: 0 18px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}
.stock-team-tab.active {
  background: #ffffff !important;
  color: #1d1d1f !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
}
.stock-toolbar-right { margin-left: auto !important; display: flex !important; align-items: center !important; gap: 10px !important; }
.stock-search-input, .inventory-search-input {
  height: 36px !important;
  padding: 0 16px !important;
  border-radius: 980px !important;
  border: 1px solid var(--hairline) !important;
  background: #ffffff !important;
  font-size: 14px !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
  min-width: 220px !important;
  letter-spacing: -0.01em !important;
}
.stock-search-input:focus, .inventory-search-input:focus {
  border-color: var(--focus-blue) !important;
  outline: none !important;
}
.btn-stock-print.btn-teamcal-primary, .btn-stock-print {
  background: #ffffff !important;
  color: #1d1d1f !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  height: 36px !important;
  padding: 0 16px !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  box-shadow: none !important;
}
.btn-stock-print:hover { background: #f5f5f7 !important; }
.stock-logs-section { padding: 24px 28px 64px !important; }
.stock-logs-title { font-size: 17px !important; font-weight: 600 !important; margin-bottom: 14px !important; }
.stock-table-wrap { margin: 0 28px !important; }

/* 재고 변경 모달 */
.stock-change-modal {
  border-radius: 20px !important;
  border: 1px solid var(--hairline) !important;
  box-shadow: 0 24px 64px rgba(0,0,0,0.22) !important;
  padding: 28px !important;
}
.stock-change-title { font-size: 20px !important; font-weight: 600 !important; letter-spacing: -0.02em !important; color: #1d1d1f !important; }
.stock-change-label { font-size: 12px !important; font-weight: 500 !important; color: var(--text-soft) !important; }
.stock-change-qty-input, .stock-change-memo-input, #stockChangeType {
  border: 1px solid var(--hairline) !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
}
.stock-change-qty-input:focus, .stock-change-memo-input:focus, #stockChangeType:focus {
  border-color: var(--focus-blue) !important; outline: none !important;
}

/* ============================================================================
   PHASE 3b · 발주 (INVENTORY)
   ============================================================================ */
.inventory-page { padding: 24px 28px 40px !important; }
.inventory-sidebar {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}
.inventory-sidebar-head { font-size: 15px !important; font-weight: 600 !important; color: #1d1d1f !important; letter-spacing: -0.01em !important; }
.btn-inventory-new-item {
  background: #ffffff !important;
  color: #0066cc !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 5px 12px !important;
}
.btn-inventory-new-item:hover { background: #f5f5f7 !important; }
.inventory-list-hint { font-size: 13px !important; color: var(--text-muted) !important; }
.inventory-cart-panel, .inventory-history-section {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}
.inventory-cart-title { font-size: 16px !important; font-weight: 600 !important; }
.inventory-cart-count {
  background: #1d1d1f !important;
  color: #fff !important;
  border-radius: 980px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 2px 9px !important;
}
.btn-inventory-order.btn-teamcal-primary, .btn-inventory-order {
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 980px !important;
  font-weight: 500 !important;
  height: 44px !important;
  font-size: 15px !important;
  box-shadow: none !important;
}
.btn-inventory-order:hover { background: #0058b0 !important; }
.inventory-month-input, .inventory-month-label {
  font-size: 13px !important;
  color: var(--text-soft) !important;
}
.inventory-history-title { font-size: 16px !important; font-weight: 600 !important; }

/* 발주 모달들 */
.inventory-detail-modal, .inventory-add-item-modal {
  border-radius: 20px !important;
  border: 1px solid var(--hairline) !important;
  box-shadow: 0 24px 64px rgba(0,0,0,0.22) !important;
}
.inventory-detail-modal-title, .inventory-add-item-title {
  font-size: 20px !important; font-weight: 600 !important; letter-spacing: -0.02em !important; color: #1d1d1f !important;
}
.inventory-add-item-label { font-size: 12px !important; font-weight: 500 !important; color: var(--text-soft) !important; }
.inventory-add-item-input, .inventory-add-item-select {
  border: 1px solid var(--hairline) !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
}
.inventory-add-item-input:focus, .inventory-add-item-select:focus {
  border-color: var(--focus-blue) !important; outline: none !important;
}
.btn-inventory-detail-save, .btn-inventory-add-item-save, .btn-inventory-detail-add-cart {
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 980px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}
.btn-inventory-detail-save:hover, .btn-inventory-add-item-save:hover, .btn-inventory-detail-add-cart:hover { background: #0058b0 !important; }
.btn-inventory-detail-cancel, .btn-inventory-add-item-cancel {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  color: #1d1d1f !important;
  font-weight: 500 !important;
}

/* ============================================================================
   PHASE 3c · 결산 (CLOSING)
   ============================================================================ */
.closing-header { padding: 24px 28px 0 !important; display: flex !important; align-items: center !important; gap: 20px !important; }
.closing-subtabs {
  display: inline-flex !important;
  padding: 3px !important;
  background: #e9e9ed !important;
  border-radius: 980px !important;
  gap: 2px !important;
}
.closing-subtab {
  background: transparent !important;
  border: 0 !important;
  border-radius: 980px !important;
  height: 30px !important;
  padding: 0 16px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--text-soft) !important;
}
.closing-subtab--active {
  background: #ffffff !important;
  color: #1d1d1f !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
}
.closing-body { padding: 20px 28px 64px !important; gap: 16px !important; }
.closing-form-card {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  padding: 22px 24px !important;
  box-shadow: none !important;
  margin-bottom: 16px !important;
}
.closing-section-title { font-size: 15px !important; font-weight: 600 !important; color: #1d1d1f !important; letter-spacing: -0.01em !important; }
.closing-label { font-size: 12px !important; font-weight: 500 !important; color: var(--text-soft) !important; letter-spacing: -0.01em !important; }
.closing-field-input {
  height: 42px !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  font-size: 15px !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: -0.01em !important;
}
.closing-field-input:focus { border-color: var(--focus-blue) !important; outline: none !important; box-shadow: 0 0 0 3px rgba(0,113,227,0.1) !important; }
.btn-closing-primary {
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 980px !important;
  font-weight: 500 !important;
  height: 40px !important;
  padding: 0 22px !important;
  font-size: 14px !important;
  box-shadow: none !important;
}
.btn-closing-primary:hover { background: #0058b0 !important; }
.btn-closing-secondary {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  color: #1d1d1f !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  padding: 6px 14px !important;
}
.closing-side-panel { display: flex !important; flex-direction: column !important; gap: 16px !important; }
.closing-cal-section, .closing-month-sum-section {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  padding: 22px !important;
  box-shadow: none !important;
}
.closing-cal-section-title, .closing-month-sum-heading { font-size: 16px !important; font-weight: 600 !important; color: #1d1d1f !important; letter-spacing: -0.01em !important; }
.btn-closing-cal-nav {
  width: 30px !important; height: 30px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  color: #1d1d1f !important;
}
.btn-closing-cal-nav:hover { background: #f5f5f7 !important; }
.closing-cal-month-label { font-size: 14px !important; font-weight: 600 !important; letter-spacing: -0.01em !important; color: #1d1d1f !important; }

/* ============================================================================
   PHASE 3d · Team 밀리
   ============================================================================ */
.team-page { padding: 24px 28px 64px !important; }
.team-member-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  gap: 16px !important;
}
.team-member-card {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  padding: 24px !important;
  box-shadow: none !important;
  transition: transform .15s, box-shadow .15s !important;
}
.team-member-card:hover { transform: translateY(-2px) !important; box-shadow: 0 8px 24px rgba(0,0,0,0.06) !important; }
.team-member-avatar {
  background: linear-gradient(180deg, #3a3a3c, #1d1d1f) !important;
  color: #fff !important;
  font-family: var(--font-display) !important;
  font-weight: 500 !important;
  border: 0 !important;
}
.team-member-name { font-size: 16px !important; font-weight: 600 !important; color: #1d1d1f !important; letter-spacing: -0.01em !important; }
.team-member-role-badge {
  border-radius: 980px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  background: rgba(0,0,0,0.05) !important;
  color: var(--text-soft) !important;
  border: 0 !important;
}
.team-member-role-badge--admin {
  background: rgba(0,102,204,0.1) !important;
  color: #0066cc !important;
}
.team-member-dept-line { font-size: 12px !important; color: var(--text-muted) !important; }

/* ============================================================================
   PHASE 3e · 팀 캘린더 (TEAMCAL)
   ============================================================================ */
.teamcal-page { padding: 24px 28px 64px !important; }
.teamcal-toolbar { margin: 8px 0 18px !important; gap: 14px !important; align-items: center !important; }
.btn-teamcal-nav {
  width: 32px !important; height: 32px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  color: #1d1d1f !important;
}
.btn-teamcal-nav:hover { background: #f5f5f7 !important; }
.teamcal-month-label {
  font-family: var(--font-display) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  color: #1d1d1f !important;
  min-width: 150px !important;
  text-align: center !important;
}
.btn-teamcal-primary {
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 980px !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  padding: 0 16px !important;
  height: 36px !important;
  box-shadow: none !important;
}
.btn-teamcal-primary:hover { background: #0058b0 !important; }
.teamcal-grid {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  box-shadow: none !important;
}
.teamcal-modal-panel {
  border-radius: 20px !important;
  border: 1px solid var(--hairline) !important;
  box-shadow: 0 24px 64px rgba(0,0,0,0.22) !important;
}
.teamcal-modal-title { font-size: 18px !important; font-weight: 600 !important; letter-spacing: -0.02em !important; }
.teamcal-type-btn {
  border-radius: 980px !important;
  border: 1px solid var(--hairline) !important;
  background: #ffffff !important;
  color: var(--text-soft) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}
.teamcal-type-btn[aria-pressed="true"] {
  background: #0066cc !important;
  color: #fff !important;
  border-color: #0066cc !important;
}

/* ============================================================================
   PHASE 3f · 비용 마감 (COST)
   ============================================================================ */
.cost-page-wrap { padding: 24px 28px 64px !important; }
.cost-card {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  padding: 24px !important;
}
.cost-card-title { font-size: 17px !important; font-weight: 600 !important; color: #1d1d1f !important; letter-spacing: -0.01em !important; }
.cost-card-sub { font-size: 13px !important; color: var(--text-soft) !important; }
.cost-step.active .cost-step-num {
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
}
.cost-step-num {
  background: #e9e9ed !important;
  color: var(--text-soft) !important;
  border-radius: 50% !important;
}
.cost-step-label { font-size: 12px !important; color: var(--text-soft) !important; }
.cost-step.active .cost-step-label { color: #1d1d1f !important; font-weight: 600 !important; }
.upload-zone {
  border: 1.5px dashed var(--hairline) !important;
  border-radius: 14px !important;
  background: #fafafc !important;
}
.upload-zone:hover { border-color: #0066cc !important; background: rgba(0,102,204,0.03) !important; }
.upload-type { font-size: 14px !important; font-weight: 600 !important; color: #1d1d1f !important; }
.upload-hint { font-size: 12px !important; color: var(--text-muted) !important; }
.cost-btn-analyze {
  background: #0066cc !important;
  color: #fff !important;
  border-radius: 980px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}
.cost-btn-analyze:disabled { background: #c7c7cc !important; color: #fff !important; }
.cost-btn-rules {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  color: #1d1d1f !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 7px 14px !important;
}
.progress-bar { background: #0066cc !important; }

/* ============================================================================
   PHASE 3g · 설정 (SETTINGS)
   ============================================================================ */
.settings-page { padding: 24px 28px 64px !important; max-width: 1000px !important; }
.settings-section-accordion {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  margin-bottom: 12px !important;
  overflow: hidden !important;
}
.settings-section-accordion-header {
  padding: 20px 24px !important;
  background: transparent !important;
}
.settings-section-accordion-title {
  font-size: 17px !important;
  font-weight: 600 !important;
  color: #1d1d1f !important;
  letter-spacing: -0.01em !important;
}
.settings-section-accordion-chevron { color: var(--text-muted) !important; }
.settings-hint { font-size: 13px !important; color: var(--text-soft) !important; }
.settings-form-card {
  background: #fafafc !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 14px !important;
  padding: 20px !important;
}
.settings-form-title { font-size: 15px !important; font-weight: 600 !important; color: #1d1d1f !important; }
.settings-field span { font-size: 12px !important; font-weight: 500 !important; color: var(--text-soft) !important; }
.settings-field input, .settings-field select,
.settings-table input, .settings-hours-table input {
  border: 1px solid var(--hairline) !important;
  border-radius: 10px !important;
  font-size: 14px !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
  background: #ffffff !important;
}
.settings-field input:focus, .settings-field select:focus {
  border-color: var(--focus-blue) !important; outline: none !important;
}
.btn-settings-primary {
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 980px !important;
  font-weight: 500 !important;
  height: 38px !important;
  padding: 0 20px !important;
  font-size: 14px !important;
  box-shadow: none !important;
}
.btn-settings-primary:hover { background: #0058b0 !important; }
.btn-settings-secondary {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  color: #1d1d1f !important;
  font-weight: 500 !important;
  height: 38px !important;
  padding: 0 18px !important;
  font-size: 14px !important;
}

/* ============================================================================
   PHASE 3h · 메신저 (MESSENGER)
   ============================================================================ */
.messenger-sidebar { background: #ffffff !important; border-right: 1px solid var(--hairline) !important; }
.messenger-sidebar-head { font-size: 13px !important; font-weight: 600 !important; color: #1d1d1f !important; letter-spacing: -0.01em !important; text-transform: none !important; }
.messenger-notice-input, .messenger-input {
  border: 1px solid var(--hairline) !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
  background: #ffffff !important;
}
.messenger-notice-input:focus, .messenger-input:focus { border-color: var(--focus-blue) !important; outline: none !important; }
.btn-messenger-notice, .btn-messenger-send, .btn-messenger-create-submit {
  background: #0066cc !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 980px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}
.btn-messenger-notice:hover, .btn-messenger-send:hover, .btn-messenger-create-submit:hover { background: #0058b0 !important; }
.btn-messenger-new-room {
  background: #ffffff !important;
  color: #0066cc !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 5px 12px !important;
}
.btn-messenger-create-cancel {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  color: #1d1d1f !important;
  font-weight: 500 !important;
}
.messenger-chat-header { background: rgba(255,255,255,0.82) !important; -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); border-bottom: 1px solid var(--hairline) !important; }
.messenger-chat-title { font-size: 15px !important; font-weight: 600 !important; color: #1d1d1f !important; }
.messenger-create-room-modal {
  border-radius: 20px !important;
  border: 1px solid var(--hairline) !important;
  box-shadow: 0 24px 64px rgba(0,0,0,0.22) !important;
}
.messenger-create-room-title { font-size: 18px !important; font-weight: 600 !important; letter-spacing: -0.02em !important; }
.messenger-create-input {
  border: 1px solid var(--hairline) !important;
  border-radius: 10px !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
}

/* ============================================================================
   PHASE 3i · 고객 (CUSTOMERS placeholder)
   ============================================================================ */
#page-customers .customers-page,
#page-customers { background: #f5f5f7 !important; }

/* ============================================================================
   PHASE 6 · 화면 채우기 + 반응형 (14" → 27")
   ============================================================================ */

/* ── (A) AI 페이지: 오더지 입력 / 어레인지 학습 — 화면 높이 꽉 채우기 ────── */
.op-header, .al-header {
  background: rgba(255,255,255,0.82) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
  backdrop-filter: saturate(180%) blur(20px) !important;
  border-bottom: 1px solid var(--hairline) !important;
  padding: 0 28px !important;
  height: 60px !important;
}
.op-title, .al-title {
  font-family: var(--font-display);
  font-size: 20px !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  color: #1d1d1f !important;
}
.op-user, .al-user { font-size: 13px !important; color: var(--text-muted) !important; }

.op-main, .al-main {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  padding: 24px 28px 28px !important;
  gap: 16px !important;
  align-items: stretch !important;
  grid-template-columns: 1fr 1fr !important;
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}
.op-panel, .al-panel {
  display: flex !important;
  flex-direction: column !important;
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  min-height: 0 !important;
  padding: 24px !important;
}
.op-panel-title, .al-panel-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #1d1d1f !important;
  letter-spacing: -0.01em !important;
  margin-bottom: 14px !important;
}
.op-textarea, .al-textarea {
  flex: 1 1 auto !important;
  min-height: 280px !important;
  resize: none !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 14px !important;
  padding: 16px !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
  background: #fafafc !important;
  letter-spacing: -0.01em !important;
}
.op-textarea:focus, .al-textarea:focus {
  border-color: var(--focus-blue) !important;
  outline: none !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(0,113,227,0.1) !important;
}
.op-hint, .al-hint {
  font-size: 12px !important;
  color: var(--text-muted) !important;
  margin: 12px 0 !important;
  line-height: 1.5 !important;
}
#opResult, #alChanges {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
}
.op-result-empty, .al-changes-empty {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--text-muted) !important;
  font-size: 14px !important;
}
.op-btn, .al-btn {
  height: 40px !important;
  padding: 0 20px !important;
  border-radius: 980px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  transition: background .15s, transform .12s !important;
}
.op-btn:active, .al-btn:active { transform: scale(0.97); }
.op-btn--primary, .al-btn--primary { background: #0066cc !important; color: #fff !important; border: 0 !important; }
.op-btn--primary:hover, .al-btn--primary:hover { background: #0058b0 !important; }
.op-btn--ghost, .al-btn--ghost {
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  color: #1d1d1f !important;
}
.op-actions, .al-actions { gap: 10px !important; margin-top: 14px !important; }

/* ── (B) 발주 페이지 — 작업 영역 높이 채우기 ──────────────────────────── */
#page-inventory .inventory-page {
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* ── (C) 어레인지 배치 그리드 — 빈 영역 줄이고 채우기 ─────────────────── */
#page-arrange { overflow: hidden !important; }

/* ── (D) 반응형 스케일업: 큰 모니터(≥1680px)에서 여백·요소 키우기 ─────── */
@media (min-width: 1680px) {
  :root { --sidebar-w: 248px !important; }
  #app-sidebar { width: 248px !important; padding: 22px 16px !important; }

  /* 좌우 여백 확대 — 콘텐츠가 화면을 더 넓게 사용 */
  .dashboard-cards, .dashboard-main, .dashboard-yearly { padding-left: 40px !important; padding-right: 40px !important; }
  .dashboard-team-sched { /* 마진 0 유지 (PHASE5) */ }
  .stock-toolbar, .stock-logs-section { padding-left: 40px !important; padding-right: 40px !important; }
  .stock-table-wrap { margin-left: 40px !important; margin-right: 40px !important; }
  .closing-header, .closing-body { padding-left: 40px !important; padding-right: 40px !important; }
  .team-page, .teamcal-page, .settings-page, .cost-page-wrap, .inventory-page { padding-left: 40px !important; padding-right: 40px !important; }
  .op-main, .al-main { padding-left: 40px !important; padding-right: 40px !important; }
  .legend-bar-cal { padding-left: 40px !important; padding-right: 40px !important; }
  .op-header, .al-header { padding-left: 40px !important; padding-right: 40px !important; }

  /* KPI·패널 시원하게 */
  .dashboard-cards { gap: 20px !important; }
  .dashboard-main { gap: 20px !important; }
  .dashboard-card-value { font-size: 46px !important; }
  .dashboard-sales-value { font-size: 40px !important; }
  .dashboard-yearly-chart { height: 200px !important; }

}

/* ── (E) 초대형 모니터(≥2200px) ───────────────────────────────────────── */
@media (min-width: 2200px) {
  :root { --sidebar-w: 268px !important; }
  #app-sidebar { width: 268px !important; }

  .dashboard-cards, .dashboard-main, .dashboard-yearly,
  .stock-toolbar, .stock-logs-section,
  .closing-header, .closing-body,
  .team-page, .teamcal-page, .settings-page, .cost-page-wrap, .inventory-page,
  .op-main, .al-main, .legend-bar-cal,
  .op-header, .al-header { padding-left: 64px !important; padding-right: 64px !important; }
  .stock-table-wrap { margin-left: 64px !important; margin-right: 64px !important; }

  body { font-size: 18px !important; }
  .dashboard-card-value { font-size: 52px !important; }
  .dashboard-yearly-chart { height: 240px !important; }
}

/* ============================================================================
   PHASE 4 · 홈 레이아웃 정리
   ── 공지 입력란을 패널 맨 아래·가로 전체로, 박스 높이 정렬
   ============================================================================ */

/* 메인 그리드 — 간격 통일, 양 컬럼 높이 정렬 */
.dashboard-main {
  gap: 16px !important;
  padding: 16px 28px 0 !important;
  align-items: stretch !important;
}
.dashboard-main-left { gap: 16px !important; }

/* 좌: 매출은 콘텐츠 높이, 근무는 남은 높이 채움 */
.dashboard-main-left > .dashboard-panel:first-child { flex: 0 0 auto !important; }
.dashboard-main-left > .dashboard-panel:last-child { flex: 1 1 auto !important; }

/* 패널 내부 여백 통일 */
.dashboard-main .dashboard-panel { padding: 24px !important; }
.dashboard-main .dashboard-panel-title { margin-bottom: 16px !important; }

/* ── 매출 요약 ─────────────────────────────────────────────────────────── */
.dashboard-sales-value {
  font-family: var(--font-display);
  font-size: 40px !important;
  font-weight: 600 !important;
  letter-spacing: -0.03em !important;
  color: #1d1d1f !important;
  font-variant-numeric: tabular-nums;
  line-height: 1 !important;
}
.dashboard-sales-unit { font-size: 14px !important; color: var(--text-soft) !important; }
.dashboard-sales-breakdown { margin-top: 12px !important; font-size: 13px !important; color: var(--text-soft) !important; }
.dashboard-sales-breakdown-item--refund { color: #c54a3a !important; }

/* ── 오늘 근무·휴무 — 행 간격 키워서 박스 자연스럽게 채움 ────────────────── */
.dashboard-team-sched--vertical .dashboard-team-sched-list {
  gap: 0 !important;
  justify-content: flex-start !important;
}
.dashboard-team-sched-row {
  padding: 13px 2px !important;
  border-bottom: 1px solid var(--hairline-faint) !important;
  align-items: center !important;
}
.dashboard-team-sched-row:last-child { border-bottom: 0 !important; }
.dashboard-team-sched--vertical .dashboard-team-sched-name {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #1d1d1f !important;
  letter-spacing: -0.01em !important;
}
.dashboard-team-sched-row .dashboard-team-sched-type {
  margin-top: 0 !important;
  padding: 4px 11px !important;
  border-radius: 980px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
.dashboard-team-sched-type--doctor { background: rgba(79,155,120,0.12) !important; color: #4f9b78 !important; }
.dashboard-team-sched-type--off    { background: rgba(197,74,58,0.10) !important; color: #c54a3a !important; }
.dashboard-team-sched-type--annual { background: rgba(139,109,195,0.12) !important; color: #8b6dc3 !important; }
.dashboard-team-sched-type--half,
.dashboard-team-sched-type--vacation { background: rgba(207,131,47,0.12) !important; color: #cf832f !important; }
.dashboard-team-sched-type--other  { background: rgba(0,0,0,0.05) !important; color: var(--text-soft) !important; }

/* ── 공지사항 — 입력란을 맨 아래로, 가로 전체 ──────────────────────────── */
.dashboard-notices {
  display: flex !important;
  flex-direction: column !important;
}
.dashboard-notices .dashboard-panel-title { order: 0; }
.dashboard-notice-list {
  order: 1;
  flex: 1 1 auto !important;
  min-height: 120px !important;
  overflow-y: auto !important;
}
.dashboard-notice-empty {
  color: var(--text-muted) !important;
  font-size: 13px !important;
  padding: 8px 2px !important;
}
.dashboard-notice-form {
  order: 2 !important;
  display: flex !important;
  align-items: stretch !important;
  gap: 10px !important;
  margin: 16px 0 0 !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--hairline) !important;
}
/* 관리자가 아닐 때 JS가 display:none 유지 — order만 적용되고 숨김은 그대로 */
.dashboard-notice-input {
  flex: 1 1 auto !important;
  height: 44px !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 12px !important;
  padding: 0 16px !important;
  font-size: 14px !important;
  background: #ffffff !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
  letter-spacing: -0.01em !important;
}
.dashboard-notice-input:focus {
  border-color: var(--focus-blue) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(0,113,227,0.1) !important;
}
.dashboard-notice-form .btn-teamcal-primary {
  flex: 0 0 auto !important;
  height: 44px !important;
  padding: 0 22px !important;
  border-radius: 12px !important;
  background: #0066cc !important;
  color: #fff !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  letter-spacing: -0.01em !important;
}
.dashboard-notice-form .btn-teamcal-primary:hover { background: #0058b0 !important; }

/* 공지 아이템 */
.dashboard-notice-item {
  border: 1px solid var(--hairline) !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
  background: #ffffff !important;
}
.dashboard-notice-meta { font-size: 12px !important; color: var(--text-muted) !important; margin-bottom: 6px !important; }
.dashboard-notice-when { font-weight: 600 !important; color: var(--text-soft) !important; }
.dashboard-notice-body { font-size: 14px !important; color: #1d1d1f !important; line-height: 1.55 !important; letter-spacing: -0.01em !important; }

/* ── 연간 매출 추이 ────────────────────────────────────────────────────── */
.dashboard-yearly {
  margin: 16px 28px 64px !important;
  padding: 24px !important;
  background: #ffffff !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}
.dashboard-yearly-chart { height: 170px !important; gap: 10px !important; }
.dashboard-yearly-bar {
  background: #0066cc !important;
  border-radius: 6px 6px 0 0 !important;
}
.dashboard-yearly-bar-col:hover .dashboard-yearly-bar { opacity: 0.82 !important; }
.dashboard-yearly-label { font-size: 11px !important; color: var(--text-muted) !important; }

/* ============================================================================
   PHASE 5 · 홈 미세 조정 (버튼 정렬 · 근무 폭 · 세로 압축)
   ============================================================================ */

/* (1) 근무·휴무 박스 가로폭 = 매출 박스 (1단계 28px 마진 잔재 제거) */
.dashboard-main-left .dashboard-team-sched,
.dashboard-main-left .dashboard-team-sched--vertical {
  margin: 0 !important;
}

/* (2) 공지 입력란 + 등록 버튼 높이 정확히 일치 */
.dashboard-notice-form {
  align-items: center !important;
  margin-top: 14px !important;
  padding-top: 14px !important;
}
.dashboard-notice-input {
  height: 46px !important;
  line-height: normal !important;
  box-sizing: border-box !important;
}
.dashboard-notice-form .btn-teamcal-primary {
  height: 46px !important;
  min-height: 0 !important;
  line-height: normal !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* (3) 세로 압축 — 매출 추이가 한 화면에 들어오도록 */
.dashboard-main { padding-top: 12px !important; }
.dashboard-main .dashboard-panel { padding: 20px 22px !important; }
.dashboard-main .dashboard-panel-title { margin-bottom: 12px !important; }
.dashboard-sales-value { font-size: 34px !important; }
.dashboard-sales-breakdown { margin-top: 10px !important; }
.dashboard-team-sched-row { padding: 9px 2px !important; }
.dashboard-team-sched--vertical .dashboard-team-sched-name { font-size: 14px !important; }
.dashboard-notice-list { min-height: 80px !important; }
.dashboard-yearly { margin-top: 12px !important; padding: 20px 22px !important; }
.dashboard-yearly-chart { height: 150px !important; }

/* ============================================================================
   PHASE 8 · 정밀 보정 (KPI 정렬 · 어레인지 채우기 · 재고 금색 제거 ·
              발주 모서리 · 팀 풀폭)
   ============================================================================ */

/* ── (1) 홈 KPI 4박스 ↔ 아래 매출/공지 박스 가로폭 정확히 일치 ─────────── */
.dashboard-cards {
  padding: 16px 28px 0 !important;
  gap: 16px !important;
  grid-template-columns: repeat(4, 1fr) !important;
}
.dashboard-card { min-width: 0 !important; }

/* ── (2) 어레인지 배치 — 흰 패널이 화면 끝까지 채우도록 ──────────────── */
#page-arrange .ar-main {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}
#page-arrange .ar-wrap-outer {
  flex: 1 1 auto !important;
  max-height: none !important;
}

/* ── (3) 재고 변경 이력 — 금색/네이비 디자인 언어 제거 → Apple ────────── */
.stock-logs-panel {
  border: 1px solid var(--hairline) !important;
  border-radius: 18px !important;
  background: #ffffff !important;
}
.stock-logs-panel-head { border-bottom: 1px solid var(--hairline) !important; }
.stock-logs-panel-title {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #1d1d1f !important;
  letter-spacing: -0.01em !important;
}
.stock-logs-date-input {
  border: 1px solid var(--hairline) !important;
  border-radius: 10px !important;
  color: #1d1d1f !important;
  -webkit-text-fill-color: #1d1d1f !important;
}
.stock-logs-date-input:focus { border-color: var(--focus-blue) !important; outline: none !important; }
.stock-log-item, .stock-change-log-item {
  border: 1px solid var(--hairline) !important;
  border-left: 3px solid #0066cc !important;
  border-radius: 0 12px 12px 0 !important;
  background: #ffffff !important;
}
.stock-log-name { color: #1d1d1f !important; font-weight: 600 !important; }
.stock-log-time, .stock-log-who, .stock-log-beforeafter { color: var(--text-muted) !important; }
.stock-log-memo-snippet { color: var(--text-muted) !important; }
.stock-log-undo {
  border: 1px solid var(--hairline) !important;
  border-radius: 980px !important;
  color: #0066cc !important;
  font-weight: 500 !important;
}
.stock-log-undo:hover {
  border-color: var(--focus-blue) !important;
  background: rgba(0,102,204,0.06) !important;
}
.stock-log-delete {
  border: 1px solid var(--hairline) !important;
  border-radius: 50% !important;
  color: var(--text-muted) !important;
}
.stock-log-delta-plus, .stock-change-plus { color: var(--tx-lifting, #4f9b78) !important; }
.stock-log-delta-minus, .stock-change-minus { color: #c54a3a !important; }

/* ── (4) 재고 표 — 불필요한 가로 스크롤 제거 ──────────────────────────── */
#page-stock .stock-table {
  min-width: 0 !important;
  width: 100% !important;
  table-layout: auto !important;
}
#page-stock .stock-table thead th,
#page-stock .stock-table tbody td {
  padding: 11px 12px !important;
  white-space: nowrap !important;
}
#page-stock .stock-table-wrap { margin: 0 !important; }
/* 단위/용량·메모 등 긴 셀은 말줄임 처리해 폭 절약 */
#page-stock .stock-table td .muted,
#page-stock .stock-table .col-unit,
#page-stock .stock-table .col-memo {
  max-width: 160px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ── (5) 발주 — 검색/카트/이력 패널 상단 모서리 라운드 클립 ──────────── */
.inventory-sidebar,
.inventory-cart-panel,
.inventory-history-section {
  overflow: hidden !important;
}
.inventory-sidebar-top { border-radius: 18px 18px 0 0 !important; }
/* 내부 리스트는 자체 스크롤 유지 */
.inventory-list, #inventoryList, .inventory-sidebar-list {
  overflow-y: auto !important;
}

/* ── (6) Team 밀리 — 좌우 여백 제거(풀폭) + 다열 채우기 ───────────────── */
.team-page {
  max-width: none !important;
  margin: 0 !important;
  padding: 24px 28px 48px !important;
}
.team-member-grid {
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
  gap: 16px !important;
}
@media (min-width: 1680px) {
  .team-page { padding-left: 40px !important; padding-right: 40px !important; }
  .team-member-grid { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)) !important; gap: 20px !important; }
}
@media (min-width: 2200px) {
  .team-page { padding-left: 64px !important; padding-right: 64px !important; }
}