/**
 * Soft Pastel Design System — 연차관리
 * 레퍼런스: cream + mint/coral/lavender/peach + navy
 */

:root {
  /* Brand — deep navy */
  --app-primary: #2d3e6b;
  --app-primary-dark: #243356;
  --app-primary-soft: #e7e9fb;
  --app-ink: #2d3e6b;
  --app-black: #2d3e6b;
  --app-accent: #c45c4e;
  --app-accent-soft: #ffd1c9;
  --app-sun: #c17a3a;
  --app-sun-soft: #fee2c5;

  /* Pastel palette */
  --ds-mint: #cbe8db;
  --ds-mint-deep: #2f6b55;
  --ds-coral: #ffd1c9;
  --ds-coral-deep: #c45c4e;
  --ds-lavender: #e7e9fb;
  --ds-lavender-deep: #4a5580;
  --ds-peach: #fee2c5;
  --ds-peach-deep: #c17a3a;

  /* Semantic */
  --ds-success: #2f6b55;
  --ds-success-soft: #cbe8db;
  --ds-warning: #c17a3a;
  --ds-warning-soft: #fee2c5;
  --ds-danger: #c45c4e;
  --ds-danger-soft: #ffd1c9;
  --ds-info: #4a5580;
  --ds-info-soft: #e7e9fb;

  /* Surfaces — warm cream */
  --app-bg: #fdf8f5;
  --app-surface: #ffffff;
  --app-text: #2a3348;
  --app-muted: #7a8499;
  --app-line: rgba(45, 62, 107, 0.08);
  --app-line-strong: rgba(45, 62, 107, 0.14);
  --app-border-w: 1px;
  --app-radius: 18px;
  --app-radius-sm: 12px;
  --app-touch: 48px;
  --app-shadow: 0 2px 8px rgba(45, 62, 107, 0.05), 0 12px 28px rgba(45, 62, 107, 0.06);
  --app-shadow-sm: 0 2px 6px rgba(45, 62, 107, 0.05);

  --font-display: "Nunito", "Noto Sans KR", sans-serif;
  --font-body: "Noto Sans KR", "Nunito", sans-serif;
  --fs-body: 0.97rem;
  --fs-small: 0.85rem;
  --lh: 1.55;

  --btn-action-h: 42px;
  --btn-action-min-w: 5.5rem;
}

body {
  font-size: var(--fs-body);
  color: var(--app-text);
  background-color: var(--app-bg);
  background-image:
    radial-gradient(ellipse 80% 50% at 0% -10%, rgba(203, 232, 219, 0.55), transparent 55%),
    radial-gradient(ellipse 70% 45% at 100% 0%, rgba(255, 209, 201, 0.4), transparent 50%),
    linear-gradient(180deg, #fdf8f5 0%, #f8f3ef 100%);
}

/* —— Header: high-contrast brand bar —— */
.app-navbar {
  background: var(--app-ink) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom: 0 !important;
  box-shadow: 0 8px 24px rgba(11, 18, 32, 0.22);
  padding-top: max(0.45rem, env(safe-area-inset-top));
  padding-bottom: 0.45rem;
}

.app-navbar .brand-logo {
  filter: none !important;
}

.app-navbar .brand-logo-on {
  background: #2563eb !important;
  color: #fff !important;
}

.app-navbar .navbar-brand,
.app-navbar .navbar-brand .brand-org,
.app-navbar .brand-org {
  color: #fff !important;
}

.app-navbar .brand-sub {
  color: rgba(255, 255, 255, 0.62) !important;
}

.app-navbar .nav-link {
  color: rgba(255, 255, 255, 0.72) !important;
  font-weight: 800;
  font-size: 0.92rem;
  border-radius: 10px;
  padding: 0.5rem 0.95rem !important;
  letter-spacing: -0.01em;
}

.app-navbar .nav-link.active,
.app-navbar .nav-link:hover {
  color: var(--app-ink) !important;
  background: var(--ds-lavender) !important;
}

.user-avatar {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 10px;
  background: var(--app-primary);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  font-weight: 800;
  flex-shrink: 0;
  letter-spacing: -0.02em;
}

.user-bar {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.75rem !important;
  border-top-color: rgba(255, 255, 255, 0.12) !important;
}

.user-bar .user-meta {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 0.65rem !important;
  min-width: 0;
}

.user-meta-text {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  gap: 0.1rem;
  text-align: left;
}

@media (min-width: 992px) {
  .user-bar {
    border-top: 0 !important;
    margin-top: 0 !important;
    padding: 0 !important;
    margin-left: 0.75rem;
  }
}

.user-bar .user-meta,
.user-bar .user-meta strong {
  color: #fff !important;
}

.user-bar .user-meta span,
.user-meta-text span {
  color: rgba(255, 255, 255, 0.62) !important;
}

.btn-logout {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 10px !important;
  font-weight: 800 !important;
}

.btn-logout:hover,
.btn-logout:focus {
  background: var(--app-primary) !important;
  color: #fff !important;
  border-color: var(--app-primary) !important;
}

.navbar-top-name,
.navbar-top-role,
.admin-top-role {
  color: rgba(255, 255, 255, 0.85) !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.16);
}

.navbar-top-actions .btn-logout,
.admin-top-actions .btn-logout {
  background: rgba(255, 255, 255, 0.1) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
}

/* —— Mobile bottom nav —— */
.mobile-bottom-nav {
  background: #fff !important;
  border-top: 1px solid var(--app-line-strong) !important;
  box-shadow: 0 -10px 32px rgba(11, 18, 32, 0.1) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.mobile-bottom-link {
  color: var(--app-muted) !important;
  border-radius: 12px;
  font-weight: 800;
}

.mobile-bottom-link.is-active,
.mobile-bottom-link:active,
.mobile-bottom-link:hover {
  color: var(--app-ink) !important;
  background: var(--ds-lavender) !important;
}

.mobile-bottom-badge {
  background: var(--ds-danger) !important;
  color: #fff !important;
}

/* —— Layout —— */
.app-main {
  padding-top: 1.35rem;
  padding-bottom: calc(2.25rem + env(safe-area-inset-bottom));
}

@media (max-width: 991.98px) {
  body.has-mobile-nav .app-main {
    padding-bottom: calc(5.75rem + env(safe-area-inset-bottom));
  }
}

/* —— Page hero —— */
.page-hero {
  margin-bottom: 1.45rem;
}

.page-hero h1 {
  font-size: clamp(1.55rem, 4vw, 2.15rem);
  font-weight: 800;
  color: var(--app-ink);
  letter-spacing: -0.04em;
  line-height: 1.15;
}

.page-hero-img {
  border-radius: 14px;
  box-shadow: var(--app-shadow);
}

.section-heading {
  margin-bottom: 0.95rem;
}

.section-heading-title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--app-ink);
}

.section-heading-desc {
  margin: 0.25rem 0 0;
  font-size: 0.88rem;
  color: var(--app-muted);
  font-weight: 600;
}

.leave-summary-heading {
  margin-bottom: 1rem;
}

.panel-heading-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  margin-bottom: 1rem;
}

.panel-heading-row .panel-title {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

.apply-remain-pill {
  display: inline-flex;
  align-items: baseline;
  gap: 0.45rem;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  background: var(--ds-coral);
  border: 0;
}

.apply-remain-label {
  font-size: 0.72rem;
  font-weight: 800;
  color: var(--ds-coral-deep);
}

.apply-remain-value {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--ds-coral-deep);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.03em;
}

/* —— Panels —— */
.panel,
.panel.admin-panel {
  background: var(--app-surface);
  border: 1px solid var(--app-line-strong) !important;
  border-radius: var(--app-radius) !important;
  box-shadow: var(--app-shadow) !important;
  padding: 1.4rem 1.45rem 1.45rem !important;
  margin-bottom: 1.25rem;
}

.panel-title,
.panel.admin-panel .panel-title {
  font-size: 1.12rem;
  font-weight: 800;
  color: var(--app-ink) !important;
  letter-spacing: -0.03em;
  padding-bottom: 0.8rem !important;
  margin-bottom: 1rem !important;
  border-bottom: 1px solid var(--app-line) !important;
}

.admin-panel-head {
  margin-bottom: 0.95rem;
  gap: 0.75rem;
}

.admin-panel-head .panel-title {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

.admin-panel-chip {
  background: var(--app-primary) !important;
  color: #fff !important;
  border: 0 !important;
  font-weight: 800;
}

/* —— Leave KPI: asymmetric bold board —— */
.leave-summary-grid {
  display: none !important; /* legacy equal grid unused */
}

.leave-kpi-board {
  display: grid;
  gap: 0.85rem;
  margin-bottom: 0.25rem;
}

@media (min-width: 768px) {
  .leave-kpi-board {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.45fr);
    gap: 1rem;
    align-items: stretch;
  }
}

.leave-kpi-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}

.leave-stat,
.leave-kpi-hero {
  padding: 1.15rem 1.2rem !important;
  border-radius: 14px !important;
  border: 1px solid var(--app-line-strong) !important;
  background: #fff !important;
  box-shadow: var(--app-shadow-sm) !important;
  min-height: 0 !important;
  margin: 0 !important;
}

.leave-stat:not(:last-child)::after {
  display: none !important;
}

.leave-stat-label {
  display: block;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--app-muted) !important;
}

.leave-stat-value {
  display: block;
  font-size: clamp(1.55rem, 3.8vw, 2.05rem) !important;
  font-weight: 800;
  letter-spacing: -0.05em;
  color: var(--app-ink) !important;
  margin-top: 0.4rem !important;
  font-variant-numeric: tabular-nums;
  line-height: 1.05;
}

.leave-stat-value-sm {
  font-size: clamp(1.05rem, 2.6vw, 1.3rem) !important;
  letter-spacing: -0.03em !important;
}

.leave-stat-meta {
  display: block;
  margin-top: 0.4rem;
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--app-muted) !important;
  line-height: 1.35;
}

/* Level 1 — Remaining leave hero (coral pastel) */
.leave-kpi-hero {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 11.5rem !important;
  padding: 1.5rem 1.55rem !important;
  background: var(--ds-coral) !important;
  border: 0 !important;
  box-shadow: var(--app-shadow) !important;
  color: var(--ds-coral-deep) !important;
}

.leave-kpi-hero .leave-stat-label {
  color: var(--ds-coral-deep) !important;
  font-size: 0.88rem;
  text-transform: none;
  letter-spacing: -0.01em;
  opacity: 0.85;
}

.leave-kpi-hero .leave-stat-value {
  color: var(--app-ink) !important;
  font-size: clamp(2.75rem, 8vw, 3.75rem) !important;
  margin-top: 0.55rem !important;
  letter-spacing: -0.06em;
}

.leave-kpi-hero .leave-stat-meta {
  color: var(--ds-coral-deep) !important;
  opacity: 0.8;
}

.leave-kpi-hero .leave-stat-bar {
  margin-top: 1rem;
  background: rgba(45, 62, 107, 0.12) !important;
  height: 8px !important;
  border-radius: 999px;
  overflow: hidden;
}

.leave-kpi-hero .leave-stat-bar-used {
  background: var(--app-ink) !important;
  height: 100%;
  border-radius: 999px;
  display: block;
}

/* Level 2 — entitled / used */
.leave-stat-focus.tone-entitled {
  background: var(--ds-lavender) !important;
  border-color: transparent !important;
  box-shadow: var(--app-shadow-sm) !important;
}

.leave-stat-focus.tone-entitled .leave-stat-value {
  color: var(--ds-lavender-deep) !important;
  font-size: clamp(1.7rem, 4vw, 2.25rem) !important;
}

.leave-stat-focus.tone-used {
  background: var(--ds-peach) !important;
  border-color: transparent !important;
  box-shadow: var(--app-shadow-sm) !important;
}

.leave-stat-focus.tone-used .leave-stat-value {
  color: var(--ds-peach-deep) !important;
  font-size: clamp(1.7rem, 4vw, 2.25rem) !important;
}

/* Level 3 — meta cards (입사일 · 근속) */
.leave-stat-meta-card {
  min-height: 5.5rem !important;
}

.leave-stat-meta-card .leave-stat-label {
  font-size: 0.72rem;
}

.leave-stat-meta-card.tone-hire,
.leave-kpi-metrics .leave-stat-meta-card:first-of-type {
  background: var(--ds-mint) !important;
  border-color: transparent !important;
  box-shadow: var(--app-shadow-sm) !important;
}

.leave-stat-meta-card.tone-hire .leave-stat-value,
.leave-kpi-metrics .leave-stat-meta-card:first-of-type .leave-stat-value {
  color: var(--ds-mint-deep) !important;
}

.leave-stat-meta-card.tone-tenure,
.leave-kpi-metrics .leave-stat-meta-card:last-of-type {
  background: #f3eee8 !important;
  border-color: transparent !important;
  box-shadow: var(--app-shadow-sm) !important;
}

.leave-stat-meta-card.tone-tenure .leave-stat-value,
.leave-kpi-metrics .leave-stat-meta-card:last-of-type .leave-stat-value {
  color: var(--app-ink) !important;
}

.leave-stat-meta-card.tone-tenure .leave-stat-meta,
.leave-kpi-metrics .leave-stat-meta-card:last-of-type .leave-stat-meta {
  color: var(--app-muted) !important;
}

/* —— Forms —— */
.form-label {
  font-size: 0.86rem;
  font-weight: 800;
  color: #1e293b;
  margin-bottom: 0.4rem;
}

.form-control,
.form-select {
  min-height: 48px;
  border-radius: var(--app-radius-sm) !important;
  border: 1.5px solid var(--app-line-strong) !important;
  background: #fff !important;
  color: var(--app-text);
  font-size: 16px;
  font-weight: 600;
  padding: 0.6rem 0.95rem;
  box-shadow: none !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--app-primary) !important;
  box-shadow: 0 0 0 4px rgba(45, 62, 107, 0.14) !important;
}

.form-control:disabled,
.form-select:disabled {
  background: #f1f5f9 !important;
  color: #94a3b8;
}

/* —— Buttons: bold primary actions —— */
.btn-hada {
  min-height: 52px;
  border-radius: 14px !important;
  background: var(--app-primary) !important;
  border: 0 !important;
  color: #fff !important;
  font-weight: 800;
  font-size: 1.02rem;
  letter-spacing: -0.02em;
  box-shadow: 0 8px 20px rgba(45, 62, 107, 0.28);
}

.btn-hada:hover,
.btn-hada:focus {
  background: var(--app-primary-dark) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(36, 51, 86, 0.32);
}

.btn-action {
  min-height: var(--btn-action-h);
  height: auto;
  min-width: var(--btn-action-min-w);
  border-radius: 10px !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
  border-width: 1.5px !important;
  padding: 0.45rem 0.9rem !important;
}

.btn-action-primary {
  background: var(--app-primary-soft) !important;
  color: var(--app-primary-dark) !important;
  border-color: rgba(21, 94, 239, 0.35) !important;
}

.btn-action-primary:hover,
.btn-action-primary:focus {
  background: var(--app-primary) !important;
  color: #fff !important;
  border-color: var(--app-primary) !important;
}

.btn-action-approve {
  background: var(--ds-success) !important;
  border-color: var(--ds-success) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(4, 120, 87, 0.25);
}

.btn-action-approve:hover,
.btn-action-approve:focus {
  filter: brightness(0.95);
  color: #fff !important;
}

.btn-action-danger,
.btn-action-reject {
  background: #fff !important;
  color: var(--ds-danger) !important;
  border-color: rgba(190, 18, 60, 0.4) !important;
}

.btn-action-danger:hover,
.btn-action-reject:hover {
  background: var(--ds-danger) !important;
  color: #fff !important;
  border-color: var(--ds-danger) !important;
}

.btn-action-secondary {
  background: #fff !important;
  color: #334155 !important;
  border-color: var(--app-line-strong) !important;
}

.btn-action-emphasis {
  background: var(--app-ink) !important;
  border-color: var(--app-ink) !important;
  color: #fff !important;
}

/* —— Status badges (color + text) —— */
.badge-status-pending {
  background: var(--ds-warning-soft) !important;
  color: #92400e !important;
}

.badge-status-prebooked {
  background: var(--ds-info) !important;
  color: #fff !important;
}

.badge-status-approved {
  background: var(--ds-success-soft) !important;
  color: #065f46 !important;
}

.badge-status-used {
  background: #e2e8f0 !important;
  color: #334155 !important;
}

.badge-status-rejected {
  background: var(--ds-danger-soft) !important;
  color: #9f1239 !important;
}

.badge-status-cancelled {
  background: #e2e8f0 !important;
  color: #64748b !important;
}

.badge-status-cancel {
  background: #e0f2fe !important;
  color: #075985 !important;
}

.badge[class*="badge-status-"] {
  border-radius: 8px !important;
  font-weight: 800 !important;
  font-size: 0.78rem !important;
  padding: 0.4em 0.7em !important;
  letter-spacing: -0.01em;
  border: 0 !important;
}

/* —— Request cards —— */
.my-request-card {
  border: 1px solid var(--app-line-strong) !important;
  border-left-width: 4px !important;
  border-radius: 14px !important;
  box-shadow: var(--app-shadow-sm) !important;
  padding: 1.15rem 1.2rem !important;
}

.my-request-date {
  font-weight: 800 !important;
  font-size: 1.02rem !important;
  color: var(--app-ink) !important;
  letter-spacing: -0.02em;
}

.my-request-days {
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums;
}

.my-request-card.status-pending {
  border-left-color: var(--ds-warning) !important;
  background: linear-gradient(90deg, #fffbeb 0%, #fff 50%) !important;
}

.my-request-card.status-prebooked {
  border-left-color: var(--ds-info) !important;
  background: linear-gradient(90deg, #e0f2fe 0%, #fff 50%) !important;
}

.my-request-card.status-approved {
  border-left-color: var(--ds-success) !important;
  background: linear-gradient(90deg, #d1fae5 0%, #fff 50%) !important;
}

.my-request-card.status-cancel_requested {
  border-left-color: #0284c7 !important;
  background: linear-gradient(90deg, #e0f2fe 0%, #fff 50%) !important;
}

.my-request-card.status-rejected {
  border-left-color: var(--ds-danger) !important;
  background: linear-gradient(90deg, #ffe4e6 0%, #fff 50%) !important;
}

.my-request-card.status-used {
  border-left-color: #94a3b8 !important;
  background: linear-gradient(90deg, #f1f5f9 0%, #fff 50%) !important;
}

.my-request-empty,
.empty-state {
  background: #f8fafc !important;
  border: 1.5px dashed var(--app-line-strong);
  border-radius: 14px;
  color: var(--app-muted);
  padding: 2rem 1.2rem !important;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
}

.empty-state i,
.my-request-empty i {
  font-size: 1.85rem;
  color: #94a3b8;
}

.empty-state-hint {
  font-size: 0.82rem;
  color: #94a3b8;
  font-weight: 600;
}

/* —— Apply —— */
.apply-range-chip {
  border: 1.5px solid var(--app-line-strong) !important;
  border-radius: 12px !important;
  background: #fff !important;
  box-shadow: var(--app-shadow-sm);
  padding: 0.85rem 1rem !important;
}

.apply-range-chip.is-active {
  border-color: var(--app-primary) !important;
  box-shadow: 0 0 0 4px rgba(21, 94, 239, 0.14) !important;
  background: var(--app-primary-soft) !important;
}

.apply-range-chip .chip-label {
  color: var(--app-muted) !important;
  font-weight: 800;
}

.apply-range-chip .chip-value,
.apply-range-chip.is-filled .chip-value {
  color: var(--app-ink) !important;
  font-weight: 800;
  font-size: 1.05rem;
}

.apply-range-cal {
  border: 1px solid var(--app-line) !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
  padding: 0.55rem !important;
}

.apply-guide {
  background: var(--app-primary-soft) !important;
  border: 1px solid rgba(21, 94, 239, 0.18) !important;
  border-left: 4px solid var(--app-primary) !important;
  border-radius: 14px !important;
}

.apply-guide-label {
  color: var(--app-primary-dark) !important;
  text-transform: none !important;
  letter-spacing: -0.01em !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
}

.apply-guide-key {
  background: #fff !important;
  color: var(--app-primary-dark) !important;
  font-weight: 800;
}

/* —— Calendar —— */
#calendar {
  border: 1px solid var(--app-line) !important;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
}

#calendar .fc-toolbar-title {
  font-weight: 800 !important;
  letter-spacing: -0.03em;
  font-size: 1.2rem !important;
  color: var(--app-ink) !important;
}

#calendar .fc-button-primary {
  background: #fff !important;
  border: 1.5px solid var(--app-line-strong) !important;
  color: var(--app-ink) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-weight: 800 !important;
}

#calendar .fc-button-primary:hover {
  background: var(--app-primary-soft) !important;
  color: var(--app-primary-dark) !important;
}

#calendar .fc-button-primary:not(:disabled).fc-button-active,
#calendar .fc-button-primary:not(:disabled):active {
  background: var(--app-ink) !important;
  border-color: var(--app-ink) !important;
  color: #fff !important;
}

.month-leave-roster {
  margin-top: 1rem;
  border: 1px solid var(--app-line) !important;
  border-radius: 14px;
  padding: 1.1rem !important;
  background: #f8fafc;
}

.month-leave-roster-title {
  font-weight: 800 !important;
  letter-spacing: -0.02em;
  font-size: 1rem !important;
}

.access-lock-banner {
  border-radius: 12px !important;
  border: 1.5px solid rgba(180, 83, 9, 0.28) !important;
  background: var(--ds-warning-soft) !important;
}

/* —— Tables —— */
.data-table-shell {
  border: 1px solid var(--app-line-strong) !important;
  border-radius: 14px !important;
  overflow: hidden;
  background: #fff;
  box-shadow: var(--app-shadow-sm);
}

.data-table-shell .table thead th {
  background: var(--app-ink) !important;
  color: rgba(255, 255, 255, 0.82) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em;
  border-bottom: 0 !important;
  padding: 0.95rem 1.05rem !important;
  text-transform: none;
}

.data-table-shell .table tbody tr {
  border-bottom: 1px solid var(--app-line) !important;
}

.data-table-shell .table tbody tr:hover {
  background: #f1f5ff !important;
}

.data-table-shell .table > :not(caption) > * > * {
  padding: 1rem 1.05rem !important;
  vertical-align: middle;
}

.data-table-shell .table tbody td {
  font-weight: 600;
  color: #1e293b;
}

.data-table-footer {
  background: #f8fafc !important;
  border-top: 1px solid var(--app-line) !important;
  color: var(--app-muted) !important;
}

/* —— Admin KPI board —— */
.admin-kpi-board {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin-bottom: 1.15rem;
}

@media (min-width: 768px) {
  .admin-kpi-board {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
  }

  .admin-kpi-board:has(.admin-kpi-card:nth-child(5)) {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.admin-kpi-card {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  column-gap: 0.35rem;
  row-gap: 0.35rem;
  align-items: end;
  padding: 1.15rem 1.2rem;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--app-line-strong);
  box-shadow: var(--app-shadow-sm);
  min-height: 6.25rem;
}

.admin-kpi-label {
  grid-column: 1 / -1;
  font-size: 0.78rem;
  font-weight: 800;
  color: var(--app-muted);
  letter-spacing: -0.01em;
}

.admin-kpi-value {
  font-size: clamp(1.9rem, 4.5vw, 2.55rem);
  font-weight: 800;
  letter-spacing: -0.06em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--app-ink);
}

.admin-kpi-unit {
  font-size: 0.9rem;
  font-weight: 800;
  color: var(--app-muted);
  padding-bottom: 0.2rem;
}

.admin-kpi-card.is-urgent {
  background: var(--ds-coral);
  border: 0;
  box-shadow: var(--app-shadow-sm);
}

.admin-kpi-card.is-urgent .admin-kpi-label {
  color: var(--ds-coral-deep);
}

.admin-kpi-card.is-urgent .admin-kpi-value {
  color: var(--app-ink);
  font-size: clamp(2.15rem, 5vw, 2.9rem);
}

.admin-kpi-card.is-urgent .admin-kpi-unit {
  color: var(--ds-coral-deep);
}

.admin-kpi-card.is-info {
  box-shadow: var(--app-shadow-sm);
  background: var(--ds-lavender);
  border-color: transparent;
}

.admin-kpi-card.is-info .admin-kpi-value {
  color: var(--ds-lavender-deep);
}

.admin-kpi-card.is-success {
  box-shadow: var(--app-shadow-sm);
  background: var(--ds-mint);
  border-color: transparent;
}

.admin-kpi-card.is-success .admin-kpi-value {
  color: var(--ds-mint-deep);
}

.admin-kpi-card.is-warning {
  box-shadow: var(--app-shadow-sm);
  background: var(--ds-peach);
  border-color: transparent;
}

.admin-kpi-card.is-warning .admin-kpi-value {
  color: var(--ds-peach-deep);
}

.admin-kpi-card.is-neutral,
.admin-kpi-card.is-active-staff {
  background: #f3eee8;
  border-color: transparent;
}

.admin-kpi-card.is-neutral .admin-kpi-value,
.admin-kpi-card.is-active-staff .admin-kpi-value {
  color: var(--app-ink);
}

.admin-kpi-card.is-resigned-staff {
  background: #efeae4;
  border-color: transparent;
  box-shadow: var(--app-shadow-sm);
}

.admin-kpi-card.is-resigned-staff .admin-kpi-label,
.admin-kpi-card.is-resigned-staff .admin-kpi-unit {
  color: #6b7280;
}

.admin-kpi-card.is-resigned-staff .admin-kpi-value {
  color: #6b7280;
}

/* —— Admin tabs —— */
.admin-tabs-wrap {
  background: #fff !important;
  border: 1px solid var(--app-line-strong) !important;
  border-radius: 14px !important;
  box-shadow: var(--app-shadow-sm) !important;
  margin-bottom: 1.1rem !important;
  padding: 0.45rem !important;
}

.admin-tabs .nav-link {
  color: var(--app-muted) !important;
  font-weight: 800 !important;
  border-radius: 10px !important;
  padding: 0.6rem 0.9rem !important;
  gap: 0.4rem;
}

.admin-tabs .nav-link.active {
  color: #fff !important;
  background: var(--app-ink) !important;
}

.admin-tab-count {
  background: var(--app-primary) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-size: 0.72rem !important;
  font-weight: 800;
  min-width: 1.25rem;
  padding: 0.15rem 0.4rem;
}

.admin-tabs .nav-link.active .admin-tab-count {
  background: #fff !important;
  color: var(--app-ink) !important;
}

.admin-tab-count.is-warning {
  background: var(--ds-warning) !important;
}

.admin-tabs-mobile-head {
  padding: 0.55rem 0.75rem 0.35rem !important;
  color: var(--app-muted);
}

.admin-tabs-mobile-current {
  color: var(--app-ink) !important;
  font-weight: 800;
}

.request-manage-stats {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.request-manage-stat {
  border-radius: 8px !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  padding: 0.35em 0.6em !important;
}

/* —— Footer (반전: 다크 배경 + 밝은 글자) —— */
.app-footer {
  background: var(--app-ink) !important;
  border-top: 0 !important;
  color: rgba(255, 255, 255, 0.78) !important;
  padding: 1.35rem 0 1.35rem !important;
  margin-top: 0.35rem;
}

.app-footer-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem 1.15rem;
}

.app-footer-meta {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.65rem 0.85rem;
  font-size: 0.88rem;
  color: rgba(255, 255, 255, 0.72);
  font-weight: 700;
  min-width: 0;
}

.app-footer-meta > span {
  white-space: nowrap;
}

.app-footer-logo {
  opacity: 1;
  width: auto !important;
  min-width: 0 !important;
  height: 2.15rem !important;
  max-height: none !important;
  padding: 0 !important;
  filter: none !important;
  flex-shrink: 0;
  background: transparent !important;
  color: inherit !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.app-footer-privacy {
  color: #fff !important;
  font-weight: 800;
  text-decoration: none;
  padding: 0.4rem 0.85rem;
  border-radius: 999px;
  border: 1.5px solid rgba(255, 255, 255, 0.35);
  background: rgba(255, 255, 255, 0.08);
  white-space: nowrap;
  flex-shrink: 0;
  line-height: 1.2;
}

.app-footer-privacy:hover {
  background: #fff !important;
  color: var(--app-ink) !important;
  text-decoration: none;
  border-color: #fff;
}

/* 하단 네비에 가리지 않도록 여백 확보 */
@media (max-width: 991.98px) {
  body.has-mobile-nav .app-footer {
    padding: 0.95rem 0 calc(5.5rem + env(safe-area-inset-bottom)) !important;
  }

  .app-footer-inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.65rem;
  }

  .app-footer-logo {
    width: auto !important;
    min-width: 0 !important;
    height: 2rem !important;
    max-height: none !important;
  }

  .app-footer-meta {
    width: 100%;
    max-width: 22rem;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.45rem 0.65rem;
    font-size: 0.78rem;
  }

  .app-footer-meta > span {
    white-space: nowrap;
  }

  .app-footer-privacy {
    padding: 0.3rem 0.65rem;
    font-size: 0.74rem;
    border-width: 1px;
  }
}

@media (max-width: 379.98px) {
  .app-footer-meta {
    flex-direction: column;
    align-items: center;
    gap: 0.45rem;
  }
}

/* —— Admin 요청관리: 모바일 카드 압축 + 날짜 배경 강조 —— */
@media (max-width: 767.98px) {
  .request-manage-panel.panel,
  .request-manage-panel.panel.admin-panel {
    padding: 0.85rem 0.75rem 0.9rem !important;
  }

  .request-manage-panel .admin-panel-head {
    margin-bottom: 0.55rem;
  }

  .request-manage-table tbody tr {
    gap: 0.28rem 0.45rem !important;
    margin: 0 0 0.65rem !important;
    padding: 0.55rem 0.65rem 0.55rem 0.7rem !important;
    border-radius: 10px !important;
    border: 1px solid var(--app-line-strong) !important;
    border-left: 5px solid #94a3b8 !important;
    box-shadow: 0 2px 8px rgba(11, 18, 32, 0.06) !important;
    background: #fff !important;
  }

  .request-manage-table tbody tr[data-status="pending"] {
    border-left-color: var(--ds-warning) !important;
    background: #fff !important;
  }

  .request-manage-table tbody tr[data-status="prebooked"] {
    border-left-color: var(--ds-info) !important;
    background: #fff !important;
  }

  .request-manage-table tbody tr[data-status="cancel_requested"] {
    border-left-color: #0284c7 !important;
    background: #fff !important;
  }

  .request-manage-table tbody tr[data-status="approved"] {
    border-left-color: var(--ds-success) !important;
    background: #fff !important;
  }

  .request-manage-table tbody tr:last-child {
    margin-bottom: 0 !important;
  }

  .request-manage-table tbody td:nth-child(4) {
    padding: 0.35rem 0.55rem !important;
    background: var(--app-ink) !important;
    border-radius: 8px !important;
  }

  .request-manage-table .request-detail-cell {
    gap: 0.05rem !important;
  }

  .request-manage-table .request-detail-date {
    font-size: 0.86rem !important;
    font-weight: 800 !important;
    color: #f8fafc !important;
    letter-spacing: -0.02em;
  }

  .request-manage-table .request-detail-meta {
    font-size: 0.74rem !important;
    font-weight: 700 !important;
    color: #94a3b8 !important;
  }

  .request-manage-table tbody td:nth-child(5) {
    font-size: 0.8rem !important;
    line-height: 1.35 !important;
    color: #64748b !important;
  }

  .request-manage-table tbody td:nth-child(5)::before {
    margin-bottom: 0.05rem !important;
    font-size: 0.68rem !important;
  }

  .request-manage-table tbody td:nth-child(3) {
    font-size: 0.78rem !important;
  }

  .request-manage-table tbody td:nth-child(7) {
    margin-top: 0.05rem !important;
  }

  .request-manage-table .request-type-chip {
    min-height: 1.55rem !important;
    padding: 0.15rem 0.5rem !important;
    font-size: 0.75rem !important;
  }

  .request-manage-table .request-action-btns {
    gap: 0.35rem !important;
  }

  .request-manage-table .request-action-btns .btn-action {
    min-height: 36px !important;
    height: 36px !important;
    font-size: 0.8rem !important;
    padding: 0.25rem 0.5rem !important;
  }

  .request-manage-table .badge[class*="badge-status-"] {
    font-size: 0.7rem !important;
    padding: 0.28em 0.5em !important;
  }

  /* —— 전체 내역: 요청관리와 동일 카드 톤 —— */
  .history-table tbody tr {
    gap: 0.28rem 0.45rem !important;
    margin: 0 0 0.65rem !important;
    padding: 0.55rem 0.65rem 0.55rem 0.7rem !important;
    border-radius: 10px !important;
    border: 1px solid var(--app-line-strong) !important;
    border-left: 5px solid #94a3b8 !important;
    box-shadow: 0 2px 8px rgba(11, 18, 32, 0.06) !important;
    background: #fff !important;
  }

  .history-table tbody tr[data-status="pending"] {
    border-left-color: var(--ds-warning) !important;
    background: #fff !important;
  }

  .history-table tbody tr[data-status="prebooked"] {
    border-left-color: var(--ds-info) !important;
    background: #fff !important;
  }

  .history-table tbody tr[data-status="cancel_requested"] {
    border-left-color: #0284c7 !important;
    background: #fff !important;
  }

  .history-table tbody tr[data-status="approved"] {
    border-left-color: var(--ds-success) !important;
    background: #fff !important;
  }

  .history-table tbody tr[data-status="rejected"] {
    border-left-color: var(--ds-danger) !important;
    background: #fff !important;
  }

  .history-table tbody tr[data-status="cancelled"],
  .history-table tbody tr[data-status="used"] {
    border-left-color: #94a3b8 !important;
    background: #fff !important;
  }

  .history-table tbody tr:last-child {
    margin-bottom: 0 !important;
  }

  .history-table tbody td:nth-child(4) {
    padding: 0.35rem 0.55rem !important;
    background: var(--app-ink) !important;
    border-radius: 8px !important;
  }

  .history-table .hist-period-cell {
    gap: 0.05rem !important;
    min-height: 0 !important;
  }

  .history-table .request-detail-date {
    font-size: 0.86rem !important;
    font-weight: 800 !important;
    color: #f8fafc !important;
    letter-spacing: -0.02em;
  }

  .history-table .request-detail-meta {
    font-size: 0.74rem !important;
    font-weight: 700 !important;
    color: #94a3b8 !important;
  }

  .history-table tbody td:nth-child(1) {
    font-size: 0.74rem !important;
    color: #64748b !important;
  }

  .history-table tbody td:nth-child(3) {
    font-size: 0.78rem !important;
  }

  .history-table tbody td:nth-child(6),
  .history-table tbody td:nth-child(7) {
    font-size: 0.8rem !important;
    line-height: 1.35 !important;
    color: #64748b !important;
  }

  .history-table tbody td:nth-child(6)::before,
  .history-table tbody td:nth-child(7)::before {
    margin-bottom: 0.05rem !important;
    font-size: 0.68rem !important;
  }

  .history-table tbody td:nth-child(8) {
    margin-top: 0.05rem !important;
  }

  .history-table .hist-delete-btn,
  .history-table .hist-reject-edit .hist-reject-save-btn {
    min-height: 36px !important;
    height: 36px !important;
    font-size: 0.8rem !important;
  }

  .history-table .badge[class*="badge-status-"] {
    font-size: 0.7rem !important;
    padding: 0.28em 0.5em !important;
  }

  .history-table .hist-reject-edit .hist-reject-reason {
    min-height: 3.25rem !important;
  }
}

/* —— 교직원 명단: 조정/사용 입력칸 잘림 방지 —— */
#tab-staff .data-table-shell {
  overflow: visible !important;
}

#tab-staff .data-table-shell .table-responsive {
  overflow-x: auto !important;
  overflow-y: visible !important;
}

.staff-list td.staff-cell-num {
  width: 4.5rem !important;
  min-width: 4.5rem !important;
  max-width: none !important;
  overflow: visible !important;
  padding-left: 0.4rem !important;
  padding-right: 0.4rem !important;
  vertical-align: middle !important;
}

.staff-list .staff-num-input.form-control,
.staff-list .staff-num-input.form-control-sm,
.staff-list .staff-num-input {
  display: block !important;
  box-sizing: border-box !important;
  width: 3.6rem !important;
  min-width: 3.6rem !important;
  max-width: 3.6rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 0.35rem !important;
  font-size: 0.95rem !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  overflow: visible !important;
  line-height: 1.2 !important;
}

.staff-list thead th:nth-child(6),
.staff-list thead th:nth-child(8) {
  min-width: 4.5rem;
  text-align: center;
}

/* —— 교직원 명단: 모바일 카드 구분 라인 —— */
@media (max-width: 767.98px) {
  .staff-list tbody tr {
    border: 1px solid var(--app-line-strong) !important;
    border-left: 1px solid var(--app-line-strong) !important;
    border-top: 5px solid var(--app-primary) !important;
    box-shadow: 0 2px 8px rgba(45, 62, 107, 0.06) !important;
    margin-bottom: 0.65rem !important;
    padding-left: 0.7rem !important;
    padding-top: 0.75rem !important;
    overflow: visible !important;
  }

  .staff-list tbody tr.is-resigned-row {
    border-top-color: #64748b !important;
  }

  .staff-list tbody tr:last-child {
    margin-bottom: 0 !important;
  }

  .staff-list td.staff-cell-num,
  .staff-list tbody td:nth-child(6),
  .staff-list tbody td:nth-child(8) {
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    overflow: visible !important;
  }

  .staff-list .staff-num-input.form-control,
  .staff-list .staff-num-input.form-control-sm,
  .staff-list .staff-num-input {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 0 0.25rem !important;
  }

  .staff-list tbody td:nth-child(5),
  .staff-list tbody td:nth-child(6),
  .staff-list tbody td:nth-child(7),
  .staff-list tbody td:nth-child(8) {
    padding-left: 0.35rem !important;
    padding-right: 0.35rem !important;
    overflow: visible !important;
  }
}

.pwa-install-banner {
  border: 1px solid var(--app-line-strong) !important;
  border-radius: 14px !important;
  box-shadow: var(--app-shadow) !important;
  background: #fff !important;
}

.app-navbar .nav-link .badge {
  border-radius: 6px !important;
  font-weight: 800;
  font-size: 0.68rem;
}

.alert {
  border-radius: 12px !important;
  border-width: 1px !important;
  font-weight: 600;
}

.org-info-panel,
.holiday-side-panel,
.leave-cap-panel {
  border-radius: 14px !important;
  box-shadow: var(--app-shadow-sm);
}

.holiday-manage-panel,
.attendance-manage-panel {
  border-width: 1px !important;
}

.holiday-manage-side,
.attendance-manage-side {
  box-shadow: var(--app-shadow-sm) !important;
}

/* —— Login —— */
.login-card:not(.login-card-admin) {
  border: 0 !important;
  border-top: 4px solid var(--app-primary) !important;
  border-radius: 18px !important;
  box-shadow: 0 16px 40px rgba(11, 18, 32, 0.12) !important;
}

body.is-auth-page:not(.is-admin-login) {
  background: var(--app-bg) !important;
}

.login-page:not(.login-page-admin) {
  background:
    radial-gradient(ellipse 80% 55% at 15% -10%, rgba(203, 232, 219, 0.55), transparent 55%),
    radial-gradient(ellipse 60% 40% at 100% 10%, rgba(255, 209, 201, 0.4), transparent 50%),
    linear-gradient(180deg, #fdf8f5 0%, #f8f3ef 100%) !important;
}

.login-card:not(.login-card-admin) h1 {
  font-weight: 800;
  letter-spacing: -0.04em;
  font-size: clamp(1.5rem, 4vw, 1.85rem);
  color: var(--app-ink);
}

.login-brand-org {
  color: var(--app-muted) !important;
  font-weight: 800;
}

.login-brand-desc {
  color: var(--app-muted) !important;
  font-weight: 600;
}

/* 관리자 로그인 — 밝은 라벤더·네이비 (교직원 크림톤과 차별) */
body.is-admin-login {
  background: #f4f5fb !important;
}

body.is-admin-login .app-main {
  background: transparent !important;
}

.login-page-admin {
  background:
    radial-gradient(ellipse 80% 55% at 10% -5%, rgba(231, 233, 251, 0.95), transparent 55%),
    radial-gradient(ellipse 60% 45% at 100% 100%, rgba(203, 232, 219, 0.45), transparent 50%),
    linear-gradient(180deg, #f4f5fb 0%, #eef0f8 55%, #f8f3ef 100%) !important;
}

.login-card-admin {
  background: #fff !important;
  color: var(--app-text) !important;
  border: 1px solid rgba(45, 62, 107, 0.1) !important;
  border-top: 4px solid var(--app-primary) !important;
  border-radius: 20px !important;
  box-shadow: 0 16px 40px rgba(45, 62, 107, 0.1) !important;
}

.login-page-admin .login-brand-org {
  color: var(--app-muted) !important;
  font-weight: 800;
}

.login-page-admin .login-brand h1 {
  color: var(--app-ink) !important;
  font-weight: 800;
  letter-spacing: -0.03em;
}

.login-page-admin .login-brand-desc,
.login-page-admin .login-brand p {
  color: var(--app-muted) !important;
}

.login-admin-badge {
  background: var(--app-primary) !important;
  color: #fff !important;
  border-radius: 999px;
  font-weight: 800;
  margin: 0 !important;
}

.login-brand-mark-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.55rem !important;
  width: 100% !important;
}

.login-page-admin .form-label {
  color: var(--app-ink) !important;
  font-weight: 800;
}

.login-page-admin .login-input-wrap {
  background: transparent !important;
}

.login-page-admin .login-input-wrap .form-control,
.login-page-admin .form-control {
  background: #f8f9fd !important;
  color: var(--app-text) !important;
  border: 1.5px solid rgba(45, 62, 107, 0.14) !important;
  border-radius: 12px !important;
  -webkit-text-fill-color: var(--app-text);
  caret-color: var(--app-ink);
}

.login-page-admin .login-input-wrap .form-control::placeholder,
.login-page-admin .form-control::placeholder {
  color: #8b93a7 !important;
  opacity: 1;
  -webkit-text-fill-color: #8b93a7;
}

.login-page-admin .login-input-wrap .form-control:focus,
.login-page-admin .form-control:focus {
  background: #fff !important;
  color: var(--app-text) !important;
  border-color: var(--app-primary) !important;
  box-shadow: 0 0 0 4px rgba(45, 62, 107, 0.12) !important;
  -webkit-text-fill-color: var(--app-text);
}

.login-page-admin .login-input-wrap i {
  color: var(--app-primary) !important;
}

.login-page-admin .btn-login-admin-submit,
.login-page-admin .btn-hada.login-submit-btn {
  background: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
  color: #fff !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 20px rgba(45, 62, 107, 0.22) !important;
}

.login-page-admin .btn-login-admin-submit:hover,
.login-page-admin .btn-login-admin-submit:focus,
.login-page-admin .btn-hada.login-submit-btn:hover,
.login-page-admin .btn-hada.login-submit-btn:focus {
  background: var(--app-primary-dark) !important;
  border-color: var(--app-primary-dark) !important;
  color: #fff !important;
}

.login-page-admin .login-divider {
  color: var(--app-muted) !important;
}

.login-page-admin .login-divider::before,
.login-page-admin .login-divider::after {
  background: rgba(45, 62, 107, 0.14) !important;
}

.login-page-admin .btn-login-staff {
  border: 1.5px solid rgba(45, 62, 107, 0.2) !important;
  background: #fff !important;
  color: var(--app-ink) !important;
  border-radius: 12px !important;
  font-weight: 800;
}

.login-page-admin .btn-login-staff:hover,
.login-page-admin .btn-login-staff:focus {
  background: var(--ds-lavender) !important;
  border-color: transparent !important;
  color: var(--app-ink) !important;
}

.login-page-admin .alert-warning {
  background: var(--ds-peach) !important;
  border-color: rgba(193, 122, 58, 0.25) !important;
  color: var(--ds-peach-deep) !important;
}

.login-page-admin .login-renewal-notice-title {
  font-weight: 700;
  margin-bottom: 0.25rem;
}

.login-page-admin .alert-danger {
  background: var(--ds-coral) !important;
  border-color: rgba(196, 92, 78, 0.25) !important;
  color: var(--ds-coral-deep) !important;
}

.login-page-admin .brand-logo,
.login-page-admin .login-brand-logo,
.login-page-admin .brand-mark-stack {
  filter: none !important;
}

/* —— Admin hero —— */
.admin-page .page-hero-compact,
.page-hero-compact {
  background: var(--app-ink) !important;
  border: 0 !important;
  box-shadow: 0 12px 28px rgba(11, 18, 32, 0.22);
  border-radius: 14px !important;
  padding: 1.25rem 1.4rem !important;
  margin-bottom: 1rem;
}

.admin-page .page-hero-compact h1,
.page-hero-compact h1 {
  color: #fff !important;
  font-size: clamp(1.45rem, 3vw, 1.85rem);
}

.page-hero-compact .section-heading-desc {
  color: rgba(255, 255, 255, 0.65) !important;
}

.admin-panel,
.admin-tabs-wrap,
.data-table-shell,
.leave-cap-panel,
.holiday-manage-panel,
.attendance-manage-panel {
  border-color: var(--app-line-strong) !important;
}

/* —— Mobile —— */
@media (max-width: 767.98px) {
  .panel,
  .panel.admin-panel {
    padding: 1.15rem 1.05rem 1.2rem !important;
    border-radius: 14px !important;
  }

  .leave-kpi-hero {
    min-height: 9.5rem !important;
    padding: 1.25rem 1.2rem !important;
  }

  .leave-kpi-hero .leave-stat-value {
    font-size: clamp(2.4rem, 12vw, 3rem) !important;
  }

  .leave-stat-focus .leave-stat-value {
    font-size: 1.55rem !important;
  }

  .page-hero h1 {
    font-size: 1.45rem;
  }

  .admin-tabs-wrap {
    border-color: var(--app-line-strong) !important;
  }

  .admin-kpi-board {
    grid-template-columns: 1fr 1fr !important;
    gap: 0.55rem !important;
  }

  .admin-kpi-card.is-urgent {
    grid-column: auto !important;
  }

  .admin-kpi-card.is-urgent .admin-kpi-value {
    font-size: clamp(1.7rem, 7vw, 2.2rem) !important;
  }

  .admin-kpi-card.is-warning {
    grid-column: 1 / -1;
  }

  .btn-hada {
    min-height: 50px;
  }
}

/* —— 공지확인 조회 버튼: select와 높이 일치 + Primary 채움 —— */
.org-info-form .notice-query-btn.btn-action,
.org-info-form .notice-query-btn.btn-action-primary {
  min-height: 48px !important;
  height: 48px !important;
  padding: 0 0.9rem !important;
  border-radius: var(--app-radius-sm) !important;
  background: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
  color: #fff !important;
  font-weight: 800 !important;
  box-shadow: 0 4px 12px rgba(45, 62, 107, 0.22);
}

.org-info-form .notice-query-btn.btn-action-primary:hover,
.org-info-form .notice-query-btn.btn-action-primary:focus {
  background: var(--app-primary-dark) !important;
  border-color: var(--app-primary-dark) !important;
  color: #fff !important;
}

.org-info-form .form-select,
.org-info-form .form-select-sm {
  min-height: 48px !important;
  height: 48px !important;
}

/* =========================================================
   Pastel theme — 카드·버튼·배지·칩 전체 강제 통일
   ========================================================= */

/* Buttons */
.btn-hada,
.btn-action-approve,
.btn-action-emphasis,
.btn-action-primary.notice-query-btn,
.history-month-btn.is-active,
.admin-tab-count:not(.is-warning) {
  background: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
  color: #fff !important;
}

.btn-action-approve:hover,
.btn-action-approve:focus,
.btn-hada:hover,
.btn-hada:focus {
  background: var(--app-primary-dark) !important;
  border-color: var(--app-primary-dark) !important;
  color: #fff !important;
}

.btn-action-primary {
  background: var(--ds-lavender) !important;
  border-color: transparent !important;
  color: var(--app-ink) !important;
}

.btn-action-primary:hover,
.btn-action-primary:focus {
  background: var(--app-primary) !important;
  color: #fff !important;
  border-color: var(--app-primary) !important;
}

.btn-action-reject,
.btn-action-danger,
.btn.cancel-btn,
.btn.force-cancel-btn,
.my-request-aside .cancel-btn,
.my-request-aside .btn-action-danger,
.hist-delete-btn {
  background: var(--ds-coral-deep) !important;
  border-color: var(--ds-coral-deep) !important;
  color: #fff !important;
}

.btn-action-reject:hover,
.btn-action-reject:focus,
.btn-action-danger:hover,
.btn-action-danger:focus,
.btn.cancel-btn:hover,
.btn.force-cancel-btn:hover,
.my-request-aside .cancel-btn:hover,
.my-request-aside .btn-action-danger:hover {
  background: #a84a3e !important;
  border-color: #a84a3e !important;
  color: #fff !important;
}

.btn-action-secondary,
.history-month-btn:not(.is-active) {
  background: #fff !important;
  border-color: var(--app-line-strong) !important;
  color: var(--app-ink) !important;
}

.btn-action-secondary:hover,
.btn-action-secondary:focus,
.history-month-btn:not(.is-active):hover {
  background: var(--ds-lavender) !important;
  border-color: transparent !important;
  color: var(--app-ink) !important;
}

.btn-action-warn {
  background: var(--ds-peach) !important;
  border-color: transparent !important;
  color: var(--ds-peach-deep) !important;
}

.btn-action-warn:hover,
.btn-action-warn:focus {
  background: var(--ds-peach-deep) !important;
  color: #fff !important;
}

/* Status badges */
.badge-status-pending,
.request-manage-stat.badge-status-pending {
  background: var(--ds-peach) !important;
  color: var(--ds-peach-deep) !important;
}

.badge-status-prebooked,
.request-manage-stat.badge-status-prebooked {
  background: var(--ds-lavender) !important;
  color: var(--ds-lavender-deep) !important;
}

.badge-status-approved,
.request-manage-stat.badge-status-approved {
  background: var(--ds-mint) !important;
  color: var(--ds-mint-deep) !important;
}

.badge-status-cancel,
.badge-status-cancel_requested {
  background: var(--ds-lavender) !important;
  color: var(--app-ink) !important;
}

.badge-status-rejected {
  background: var(--ds-coral) !important;
  color: var(--ds-coral-deep) !important;
}

.badge-status-used,
.badge-status-cancelled {
  background: #efeae4 !important;
  color: #6b7280 !important;
}

/* Request type chips */
.request-type-pending {
  background: var(--ds-peach) !important;
  color: var(--ds-peach-deep) !important;
  border-color: transparent !important;
}

.request-type-prebooked {
  background: var(--ds-lavender) !important;
  color: var(--ds-lavender-deep) !important;
  border-color: transparent !important;
}

.request-type-cancel_requested {
  background: var(--ds-lavender) !important;
  color: var(--app-ink) !important;
  border-color: transparent !important;
}

.request-type-approved {
  background: var(--ds-mint) !important;
  color: var(--ds-mint-deep) !important;
  border-color: transparent !important;
}

/* My request cards — solid pastel, no gradient */
.my-request-card {
  background: #fff !important;
  border-color: var(--app-line-strong) !important;
}

.my-request-card.status-pending {
  border-left-color: var(--ds-peach-deep) !important;
  background: #fff !important;
}

.my-request-card.status-prebooked {
  border-left-color: var(--ds-lavender-deep) !important;
  background: #fff !important;
}

.my-request-card.status-approved {
  border-left-color: var(--ds-mint-deep) !important;
  background: #fff !important;
}

.my-request-card.status-cancel_requested {
  border-left-color: var(--app-primary) !important;
  background: #fff !important;
}

.my-request-card.status-rejected {
  border-left-color: var(--ds-coral-deep) !important;
  background: #fff !important;
}

.my-request-card.status-used {
  border-left-color: #94a3b8 !important;
  background: #fff !important;
}

.my-request-chip.chip-full {
  background: var(--ds-lavender) !important;
  color: var(--app-ink) !important;
}

.my-request-chip.chip-half {
  background: var(--ds-peach) !important;
  color: var(--ds-peach-deep) !important;
}

.my-request-chip.chip-quarter {
  background: #e0f2fe !important;
  color: #0369a1 !important;
}

/* Admin request left borders */
.request-manage-table tbody tr[data-status="pending"],
.history-table tbody tr[data-status="pending"] {
  border-left-color: var(--ds-peach-deep) !important;
}

.request-manage-table tbody tr[data-status="prebooked"],
.history-table tbody tr[data-status="prebooked"] {
  border-left-color: var(--ds-lavender-deep) !important;
}

.request-manage-table tbody tr[data-status="cancel_requested"],
.history-table tbody tr[data-status="cancel_requested"] {
  border-left-color: var(--app-primary) !important;
}

.request-manage-table tbody tr[data-status="approved"],
.history-table tbody tr[data-status="approved"] {
  border-left-color: var(--ds-mint-deep) !important;
}

.history-table tbody tr[data-status="rejected"] {
  border-left-color: var(--ds-coral-deep) !important;
}

/* Staff / leave chips */
.staff-leave-chip-statutory,
.staff-list thead .staff-col-statutory {
  color: var(--ds-lavender-deep) !important;
}

.staff-leave-chip-remain,
.staff-list thead .staff-col-remain {
  color: var(--ds-coral-deep) !important;
}

.staff-leave-chip-entitled {
  color: var(--app-ink) !important;
}

.staff-role-badge.is-staff {
  background: var(--ds-mint) !important;
  color: var(--ds-mint-deep) !important;
}

.staff-calendar-chip {
  background: var(--ds-lavender) !important;
  color: var(--app-ink) !important;
}

.staff-calendar-chip.is-hidden {
  background: var(--ds-peach) !important;
  color: var(--ds-peach-deep) !important;
}

/* Bootstrap utility badges used in UI */
.badge.text-bg-warning,
.badge.text-bg-warning * {
  background: var(--ds-peach) !important;
  color: var(--ds-peach-deep) !important;
}

.badge.text-bg-success {
  background: var(--ds-mint) !important;
  color: var(--ds-mint-deep) !important;
}

.badge.text-bg-primary {
  background: var(--app-primary) !important;
  color: #fff !important;
}

.badge.text-bg-danger {
  background: var(--ds-coral) !important;
  color: var(--ds-coral-deep) !important;
}

.badge.text-bg-secondary {
  background: #efeae4 !important;
  color: #6b7280 !important;
}

.badge.text-bg-info {
  background: var(--ds-lavender) !important;
  color: var(--ds-lavender-deep) !important;
}

/* Panels / cards / alerts */
.panel,
.panel.admin-panel,
.org-info-panel,
.past-leave-panel,
.holiday-side-panel,
.leave-cap-panel,
.data-table-shell,
.admin-tabs-wrap,
.apply-guide,
.month-leave-roster {
  border-color: var(--app-line-strong) !important;
}

.apply-guide {
  background: var(--ds-lavender) !important;
  border-left-color: var(--app-primary) !important;
}

.apply-guide-label,
.apply-guide-key {
  color: var(--app-ink) !important;
}

.apply-guide-key {
  background: #fff !important;
}

.access-lock-banner,
.alert-warning {
  background: var(--ds-peach) !important;
  border-color: rgba(193, 122, 58, 0.25) !important;
  color: var(--ds-peach-deep) !important;
}

.alert-success {
  background: var(--ds-mint) !important;
  border-color: rgba(47, 107, 85, 0.25) !important;
  color: var(--ds-mint-deep) !important;
}

.alert-danger {
  background: var(--ds-coral) !important;
  border-color: rgba(196, 92, 78, 0.25) !important;
  color: var(--ds-coral-deep) !important;
}

.alert-info {
  background: var(--ds-lavender) !important;
  border-color: rgba(74, 85, 128, 0.25) !important;
  color: var(--ds-lavender-deep) !important;
}

/* Calendar / chips */
.apply-range-chip.is-active {
  background: var(--ds-lavender) !important;
  border-color: var(--app-primary) !important;
  box-shadow: 0 0 0 3px rgba(45, 62, 107, 0.12) !important;
}

#calendar .fc-button-primary:not(:disabled).fc-button-active,
#calendar .fc-button-primary:not(:disabled):active {
  background: var(--app-ink) !important;
  border-color: var(--app-ink) !important;
  color: #fff !important;
}

#calendar .fc-button-primary:hover {
  background: var(--ds-lavender) !important;
  color: var(--app-ink) !important;
}

/* Table header */
.data-table-shell .table thead th {
  background: var(--app-ink) !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

.data-table-shell .table tbody tr:hover {
  background: rgba(231, 233, 251, 0.55) !important;
}

/* Payslip / promotion status cells */
.payslip-status-legend-item.is-acked,
.leave-promotion-legend-item.is-acked {
  background: var(--ds-mint) !important;
  color: var(--ds-mint-deep) !important;
}

.payslip-status-legend-item.is-pending,
.leave-promotion-legend-item.is-pending {
  background: var(--ds-peach) !important;
  color: var(--ds-peach-deep) !important;
}

/* Login staff accent */
.login-card:not(.login-card-admin) {
  border-top-color: var(--app-primary) !important;
}

.login-card:not(.login-card-admin) .btn-hada {
  background: var(--app-primary) !important;
  border-radius: 14px !important;
}

/* Admin panel chips */
.admin-panel-chip {
  background: var(--ds-lavender) !important;
  color: var(--app-ink) !important;
}

.admin-tab-count.is-warning {
  background: var(--ds-peach-deep) !important;
  color: #fff !important;
}

/* Mobile bottom badge */
.mobile-bottom-badge {
  background: var(--ds-coral-deep) !important;
  color: #fff !important;
}

/* Soften black leftovers */
.btn-logout {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
}

.btn-logout:hover {
  background: var(--ds-lavender) !important;
  color: var(--app-ink) !important;
  border-color: transparent !important;
}