/* ── HR Blizz · Interactive Payroll Admin Console prototype styles ── */

/* ════════════════════════════════════════════════════════════
   Product Tour · 4-step spotlight overlay
   Plays once after the scroll-zoom lands. Spotlights the active
   sidebar item with a soft orange ring + dark dim of the rest,
   and shows a tooltip beside it with Back / Next / Skip controls.
   ──────────────────────────────────────────────────────────── */
.pt-overlay {
  position: absolute;
  inset: 0;
  z-index: 120;
  pointer-events: none;
  font-family: var(--font-body);
}
.pt-blocker {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: auto;
  background: transparent;
}
.pt-spot {
  position: absolute;
  z-index: 3;
  pointer-events: none;
  border-radius: 12px;
  box-shadow:
    0 0 0 3px var(--accent),
    0 0 0 6px rgba(255, 255, 255, 0.85),
    0 0 38px 8px rgba(255, 95, 31, 0.55);
  transition:
    top 0.42s var(--ease-emphasized),
    left 0.42s var(--ease-emphasized),
    width 0.42s var(--ease-emphasized),
    height 0.42s var(--ease-emphasized);
}

/* 4-strip dim frame around the spotlight target — surrounds the
   cutout cleanly so the console content reads through it. */
.pt-dim {
  position: absolute;
  z-index: 2;
  pointer-events: none;
  background: rgba(0, 23, 56, 0.42);
  transition:
    top 0.42s var(--ease-emphasized),
    left 0.42s var(--ease-emphasized),
    width 0.42s var(--ease-emphasized),
    height 0.42s var(--ease-emphasized);
}
.pt-dim-top   { left: 0; right: 0; top: 0; }
.pt-dim-bot   { left: 0; right: 0; bottom: 0; }
.pt-dim-left  { left: 0; }
.pt-dim-right { right: 0; }
.pt-tip {
  position: absolute;
  z-index: 90;
  pointer-events: auto;
  transform: translateY(-50%);
  width: 380px;
  padding: 18px 20px 16px;
  background: #fff;
  border-radius: 16px;
  border: 1px solid var(--rule);
  box-shadow: 0 24px 48px -18px rgba(0, 23, 56, 0.34), 0 2px 6px -2px rgba(0, 23, 56, 0.10);
  animation: ptTipIn 0.4s var(--ease-emphasized);
}
@keyframes ptTipIn {
  from { opacity: 0; transform: translateY(-50%) translateX(-6px); }
  to   { opacity: 1; transform: translateY(-50%); }
}
.pt-tip-arrow {
  position: absolute;
  left: -7px; top: 50%;
  width: 13px; height: 13px;
  background: #fff;
  border-left: 1px solid var(--rule-strong);
  border-bottom: 1px solid var(--rule-strong);
  transform: translateY(-50%) rotate(45deg);
}
.pt-tip--left .pt-tip-arrow { left: auto; right: -7px; border: 0; border-right: 1px solid var(--rule-strong); border-top: 1px solid var(--rule-strong); }
.pt-tip--below .pt-tip-arrow { top: -7px; left: 30px; border: 0; border-left: 1px solid var(--rule-strong); border-top: 1px solid var(--rule-strong); transform: rotate(45deg); }
.pt-tip--below.pt-tip--above .pt-tip-arrow { top: auto; bottom: -7px; border: 0; border-right: 1px solid var(--rule-strong); border-bottom: 1px solid var(--rule-strong); transform: rotate(45deg); }
.pt-tip--left, .pt-tip--below { animation: ptTipFade 0.28s var(--ease-emphasized); }
@keyframes ptTipFade { from { opacity: 0; } to { opacity: 1; } }
.pt-tip-head {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 12px;
}
.pt-tip-count {
  margin-left: auto;
  display: inline-flex; align-items: baseline; gap: 1px;
  font: 600 11px/1 var(--font-mono); letter-spacing: 0.02em;
  color: var(--ink-3);
}
.pt-tip-count em { font-style: normal; font-weight: 700; color: var(--ink); }
.pt-tip-content { animation: ptStepIn 0.42s var(--ease-emphasized) both; }
@keyframes ptStepIn {
  from { opacity: 0; transform: translateY(8px); filter: blur(2px); }
  to   { opacity: 1; transform: none; filter: blur(0); }
}
.pt-tip-step {
  display: inline-flex; align-items: baseline; gap: 6px;
  font: 600 11px/1 var(--font-body);
  color: var(--ink-3);
  flex: 1; min-width: 0;
}
.pt-tip-step em {
  font-style: normal; font-weight: 700;
  font-family: var(--font-mono);
  letter-spacing: 0.06em;
  color: var(--accent);
  font-size: 11.5px;
}
.pt-tip-step b {
  font-weight: 700;
  color: var(--ink);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 10.5px;
  font-family: var(--font-mono);
}
.pt-tip-sep { color: var(--rule-strong); }
.pt-tip-sub {
  color: var(--ink-3);
  font-weight: 500;
  letter-spacing: 0.02em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pt-tip-skip {
  appearance: none; border: 0; background: none; cursor: pointer;
  padding: 5px 8px;
  border-radius: 6px;
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--accent);
  transition: background 0.15s, color 0.15s;
  white-space: nowrap;
  flex: none;
}
.pt-tip-skip:hover { background: var(--hrb-orange-00); color: var(--hrb-orange-70); }

/* close (X) button in the top-right corner — universal dismiss affordance */
.pt-tip-x {
  appearance: none; cursor: pointer;
  flex: none;
  width: 26px; height: 26px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: var(--ink-3);
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.pt-tip-x:hover { background: var(--hrb-darkblue-00); border-color: var(--rule); color: var(--ink); }
.pt-tip-x:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.pt-tip-title {
  margin: 0 0 6px;
  font: 650 18px/1.25 var(--font-display);
  letter-spacing: -0.015em;
  color: var(--ink);
  text-wrap: pretty;
}
.pt-tip-body {
  margin: 0;
  font: 400 14px/1.55 var(--font-body);
  color: var(--ink-2);
  text-wrap: pretty;
}
/* "Live demo" badge — compact affordance in the tooltip header */
.pt-tip-live {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 9px;
  border-radius: 999px;
  background: var(--hrb-orange-00, #FFF5EE);
  border: 1px solid var(--hrb-orange-30, #FFD2B5);
  font: 700 9.5px/1 var(--font-mono);
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--hrb-orange-70, #C13A00);
  white-space: nowrap;
}
.pt-tip-live i {
  flex: none;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 0 rgba(255, 95, 31, 0.5);
  animation: ptLivePulse 1.8s var(--ease-emphasized) infinite;
}
@keyframes ptLivePulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 95, 31, 0.55); }
  60%      { box-shadow: 0 0 0 6px rgba(255, 95, 31, 0); }
}

/* Compact one-line CTA above the footer, no card. */
.pt-tip-cta {
  margin: 10px 0 0;
  display: flex; align-items: center; gap: 7px;
  font: 600 12.5px/1.4 var(--font-body);
  color: var(--accent);
  letter-spacing: 0.005em;
}
.pt-tip-cta::before {
  content: ""; flex: none;
  width: 14px; height: 14px; border-radius: 50%;
  background: var(--hrb-orange-00, #FFF5EE);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF5F1F' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
  background-size: 9px; background-repeat: no-repeat; background-position: center;
}

@media (prefers-reduced-motion: reduce) {
  .pt-tip-live i { animation: none; }
}

.pt-tip-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 18px; padding-top: 14px;
  border-top: 1px solid var(--rule);
}
.pt-tip-dots { display: inline-flex; gap: 6px; align-items: center; }
.pt-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: rgba(0,23,56,0.16); cursor: pointer; transition: background .18s, transform .18s; }
.pt-dot.on { background: var(--accent); transform: scale(1.35); }
.pt-dot.done { background: var(--ink-2); }
.pt-dot:hover { background: var(--accent); }
.pt-tip-nextup { margin: 6px 0 0; font: 400 12px/1.4 var(--font-body, inherit); color: var(--ink-2, #3F587F); opacity: .8; }
.pt-tip-dots span {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(0, 23, 56, 0.16);
  transition: background 0.2s, transform 0.2s;
}
.pt-tip-dots span.on { background: var(--accent); transform: scale(1.3); }
.pt-tip-dots span.done { background: var(--ink-2); }
.pt-tip-btns { display: inline-flex; gap: 8px; }
.pt-tip-back {
  appearance: none; cursor: pointer;
  padding: 8px 14px; border-radius: 8px;
  border: 1px solid var(--rule-strong); background: #fff; color: var(--ink-2);
  font: 600 12.5px/1 var(--font-body);
  transition: background 0.15s, border-color 0.15s;
}
.pt-tip-back:hover { background: var(--hrb-darkblue-00); border-color: var(--hrb-darkblue-30); }

.pt-tip-skip-foot {
  appearance: none; cursor: pointer;
  padding: 8px 12px; border-radius: 8px;
  border: 0; background: none; color: var(--ink-3);
  font: 600 12.5px/1 var(--font-body);
  transition: color 0.15s, background 0.15s;
}
.pt-tip-skip-foot:hover { color: var(--ink); background: var(--hrb-darkblue-00); }
.pt-tip-next {
  appearance: none; cursor: pointer;
  padding: 8px 14px; border-radius: 8px;
  border: 1px solid var(--accent); background: var(--accent); color: #fff;
  font: 600 12.5px/1 var(--font-body);
  white-space: nowrap;
  box-shadow: 0 6px 14px -6px rgba(255, 95, 31, 0.55);
  transition: background 0.15s, transform 0.15s var(--ease-spring);
}
.pt-tip-next:hover { background: var(--hrb-orange-70); }
.pt-tip-next:active { transform: scale(0.97); }

/* When the product tour is running, suppress the post-tour 3-click coach
   affordances so we don't show two guides at once. */
.pac-tour.pt-on .pac-coach,
.pac-tour.pt-on .pac-fab-wrap,
.pac-tour.pt-on .pac-side .pac-nav-item .pac-nav-l::after { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  .pt-spot { transition: none; }
  .pt-tip { animation: none; }
}

/* ════════════════════════════════════════════════════════════
   Demo Popup · instructional tooltip for non-functional buttons.
   Surfaced only when a click produced zero DOM mutation. Anchored
   at the clicked element, dims the rest with a soft backdrop;
   closes on backdrop click, Got it, or Contact us.
   ──────────────────────────────────────────────────────────── */
.pac-demo-backdrop {
  position: absolute; inset: 0;
  z-index: 70;
  background: rgba(0, 23, 56, 0.22);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  animation: pacDemoBdIn 0.2s var(--ease-standard);
}
@keyframes pacDemoBdIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes pacDemoBdOut { from { opacity: 1; } to { opacity: 0; } }
.pac-demo-backdrop.is-closing { animation: pacDemoBdOut 0.2s var(--ease-standard) both; }

.pac-demo-pop {
  position: absolute;
  z-index: 71;
  width: min(430px, calc(100% - 40px));
  padding: 26px;
  background: #fff;
  border-radius: 16px;
  border: 0;
  box-shadow: 0 30px 70px -28px rgba(0, 23, 56, 0.30), 0 8px 24px -12px rgba(0, 23, 56, 0.14);
  animation: pacDemoIn 0.28s var(--ease-emphasized);
  font-family: var(--font-body);
}
.pac-demo-pop--bottom { transform: translateX(-50%); }
.pac-demo-pop--top { transform: translate(-50%, -100%); }
.pac-demo-pop--center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: pacDemoCenterIn 0.26s var(--ease-emphasized) both;
}
.pac-demo-pop--center.is-closing { animation: pacDemoCenterOut 0.2s var(--ease-standard) both; }
@keyframes pacDemoCenterIn { from { opacity: 0; transform: translate(-50%, -46%) scale(0.96); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
@keyframes pacDemoCenterOut { from { opacity: 1; transform: translate(-50%, -50%) scale(1); } to { opacity: 0; transform: translate(-50%, -48%) scale(0.97); } }
@keyframes pacDemoIn { from { opacity: 0; } to { opacity: 1; } }

.pac-demo-arrow {
  position: absolute; left: 50%; width: 12px; height: 12px;
  background: #fff;
  border: 1px solid var(--rule-strong);
}
.pac-demo-pop--bottom .pac-demo-arrow {
  top: -7px; transform: translateX(-50%) rotate(45deg);
  border-right: 0; border-bottom: 0;
}
.pac-demo-pop--top .pac-demo-arrow {
  bottom: -7px; transform: translateX(-50%) rotate(45deg);
  border-left: 0; border-top: 0;
}

.pac-demo-eyebrow {
  display: inline-flex; align-items: center; gap: 7px;
  font: 700 10px/1 var(--font-body);
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--accent);
  margin-bottom: 12px;
}
.pac-demo-eyebrow i {
  width: 6px; height: 6px; border-radius: 50%; background: var(--accent);
  animation: pacDemoPulse 1.6s var(--ease-emphasized) infinite;
}
@keyframes pacDemoPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50%      { transform: scale(1.4); opacity: 0.5; }
}
.pac-demo-t {
  margin: 0;
  font: 700 22px/1.25 var(--font-display);
  letter-spacing: -0.01em;
  color: var(--ink);
}
.pac-demo-s {
  margin: 10px 0 0;
  font: 400 13.5px/1.6 var(--font-body);
  color: var(--ink-2);
}
.pac-demo-btns {
  display: flex; gap: 8px; align-items: center; justify-content: flex-end;
  margin-top: 20px;
}
.pac-demo-close {
  appearance: none; cursor: pointer;
  padding: 10px 20px; border-radius: 999px;
  border: 0; background: var(--hrb-darkblue-10, #EEF1F6); color: var(--ink);
  font: 600 13px/1 var(--font-body);
  transition: background 0.15s;
}
.pac-demo-close:hover { background: var(--hrb-darkblue-20, #DDE3EC); }
.pac-demo-cta {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 10px 20px; border-radius: 999px;
  background: var(--accent); color: #fff !important;
  font: 600 13px/1 var(--font-body);
  text-decoration: none;
  box-shadow: 0 6px 14px -6px rgba(255, 95, 31, 0.55);
  transition: background 0.15s, transform 0.15s var(--ease-spring);
}
.pac-demo-cta:hover { background: var(--hrb-orange-70); }
.pac-demo-cta:active { transform: scale(0.97); }

@media (prefers-reduced-motion: reduce) {
  .pac-demo-backdrop, .pac-demo-pop, .pac-demo-eyebrow i { animation: none; }
}

/* Override: when the console renders inside the tour frame, remove the section
   chrome so the tour-frame controls sizing/borders. */
.pac-tour .pac-shell-in-tour {
  background: transparent;
  border: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.pac-tour .pac-shell-in-tour .pac-shell-inner {
  height: 100%;
  min-height: 0;
  max-height: none;
  /* bind the single grid row to the frame height so the sidebar and main both
     inherit a bounded height and scroll internally instead of overflowing */
  grid-template-rows: minmax(0, 1fr);
}
.pac-tour .pac-shell-in-tour .pac-main {
  max-height: none;
  height: 100%;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

/* ── Live-demo affordance · persistent + pulsing ── */
.pac-tour .pac-demo-badge {
  position: absolute;
  top: 14px;
  right: 18px;
  z-index: 20;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px 8px 12px;
  border-radius: 999px;
  background: linear-gradient(135deg, #0F8529, #14a83a);
  color: #fff;
  font: 700 11px var(--font-body);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: 0 8px 18px -8px rgba(15, 133, 41, 0.55), 0 1px 0 rgba(255,255,255,0.15) inset;
  cursor: default;
  white-space: nowrap;
  animation: pacBadgeIn 0.7s var(--ease-spring) both;
}
.pac-tour .pac-demo-badge i {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #fff;
  position: relative;
  box-shadow: 0 0 0 0 rgba(255,255,255,0.55);
  animation: pacBadgePulse 1.8s ease-out infinite;
}
@keyframes pacBadgeIn { 0% { transform: translateY(-12px) scale(0.85); opacity: 0; } 100% { transform: none; opacity: 1; } }
@keyframes pacBadgePulse {
  0%   { box-shadow: 0 0 0 0 rgba(255,255,255,0.6); }
  80%  { box-shadow: 0 0 0 10px rgba(255,255,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); }
}

/* ── Guided demo coach mark (2–3 steps) ── */
/* Bottom orange "Live example…" hint and the persistent top-right badge are
   both suppressed inside the prototype — the coach mark below carries the
   affordance instead, and only nags through 2–3 clicks. */
.pac-tour .tour-hint { display: none; }
.pac-tour .pac-demo-badge { display: none; }

/* ── Skip interactive console demo · pinned to the dark-blue band below the
   console frame. Always visible regardless of scroll position in the tour
   track; jumps the page to the next section on click. ── */
.tour-skip {
  position: absolute;
  bottom: max(20px, env(safe-area-inset-bottom));
  left: 50%;
  transform: translateX(-50%);
  z-index: 6;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 11px 22px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: rgba(0, 23, 56, 0.55);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  color: rgba(255, 255, 255, 0.86);
  font: 600 14px/20px var(--font-body, "Source Sans 3", sans-serif);
  letter-spacing: 0.01em;
  cursor: pointer;
  pointer-events: auto;
  transition: background var(--motion-fast, 150ms) var(--ease-standard, ease),
              border-color var(--motion-fast, 150ms) var(--ease-standard, ease),
              color var(--motion-fast, 150ms) var(--ease-standard, ease),
              transform var(--motion-fast, 150ms) var(--ease-standard, ease);
}
.tour-skip:hover {
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.4);
  color: #fff;
}
.tour-skip:active { transform: translateX(-50%) scale(0.97); }
.tour-skip:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--ink, #001738), 0 0 0 4px #FF5F1F; }
.tour-skip-arr {
  flex: none;
  animation: tourSkipArr 1.8s var(--ease-standard, ease) infinite;
}
.tour-skip:hover .tour-skip-arr { animation-play-state: paused; transform: translateY(2px); }
@keyframes tourSkipArr {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(3px); }
}
@media (prefers-reduced-motion: reduce) {
  .tour-skip-arr { animation: none; }
}

.pac-coach {
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 25;
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 12px 14px 12px 18px;
  border-radius: 14px;
  background: rgba(0, 23, 56, 0.72);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: 1px solid rgba(255, 255, 255, 0.10);
  color: #fff;
  box-shadow:
    0 22px 36px -16px rgba(0,23,56,0.55),
    inset 0 1px 0 rgba(255,255,255,0.14);
  animation: pacCoachIn 0.6s var(--ease-emphasized) both;
  max-width: calc(100% - 32px);
}
.pac-coach-step {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  font: 700 10px var(--font-mono);
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.85);
}
.pac-coach-step i {
  display: inline-block;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--pac-orange);
  box-shadow: 0 0 0 0 rgba(255, 95, 31, 0.6);
  animation: pacCoachDot 1.8s ease-out infinite;
}
@keyframes pacCoachDot {
  0%   { box-shadow: 0 0 0 0 rgba(255, 95, 31, 0.7); }
  80%  { box-shadow: 0 0 0 9px rgba(255, 95, 31, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 95, 31, 0); }
}
.pac-coach-text { font: 600 13px/1.45 var(--font-body); }
.pac-coach-text b { color: var(--pac-orange); font-weight: 700; }
.pac-coach-dots { display: inline-flex; gap: 4px; margin-left: 4px; }
.pac-coach-dots span { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,0.18); }
.pac-coach-dots span.is-done { background: rgba(255, 95, 31, 0.55); }
.pac-coach-dots span.is-on   { background: var(--pac-orange); }
.pac-coach-x {
  width: 26px; height: 26px; border-radius: 8px;
  background: rgba(255,255,255,0.08);
  color: #fff; border: 0; cursor: pointer;
  display: grid; place-items: center;
}
.pac-coach-x:hover { background: rgba(255,255,255,0.16); }
.pac-coach-x svg { width: 12px; height: 12px; }
@keyframes pacCoachIn { from { transform: translate(-50%, 16px); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } }

/* ── Paywall modal (after 3 nav steps) ── */
.pac-paywall-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 23, 56, 0.55);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  z-index: 60;
  display: grid;
  place-items: center;
  padding: 24px;
  animation: pacFadeIn 0.22s ease-out both;
}
@keyframes pacFadeIn { from { opacity: 0; } to { opacity: 1; } }
.pac-paywall {
  position: relative;
  width: min(460px, calc(100% - 32px));
  background: #fff;
  border: 1px solid var(--pac-line);
  border-radius: 18px;
  padding: 30px 30px 26px;
  box-shadow: 0 28px 56px -20px rgba(0,23,56,0.45), 0 2px 0 rgba(0,23,56,0.02);
  text-align: left;
  animation: pacModalIn 0.32s var(--ease-emphasized) both;
}
@keyframes pacModalIn {
  from { transform: translateY(14px) scale(0.96); opacity: 0; }
  to   { transform: none; opacity: 1; }
}
.pac-paywall-ic {
  width: 48px; height: 48px;
  border-radius: 12px;
  background: linear-gradient(135deg, #FFF1EA, #FFE3D7);
  color: var(--pac-orange);
  display: grid; place-items: center;
  margin-bottom: 16px;
}
.pac-paywall-tag {
  font: 700 10px/1 var(--font-mono);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pac-orange);
  display: inline-block;
  margin-bottom: 10px;
}
.pac-paywall-h {
  font: 700 22px/1.2 var(--font-display);
  color: var(--pac-ink);
  margin: 0 0 10px;
  letter-spacing: -0.018em;
}
.pac-paywall-p {
  font: 400 14px/1.55 var(--font-body);
  color: var(--pac-ink2);
  margin: 0 0 22px;
  text-wrap: pretty;
}
.pac-paywall-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.pac-paywall-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 10px 16px;
  border-radius: 10px;
  font: 600 13px/1 var(--font-body);
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s, border-color 0.15s, transform 0.15s, box-shadow 0.15s;
}
.pac-paywall-btn-primary {
  background: var(--pac-orange);
  color: #fff;
  margin-left: auto;
  padding: 11px 18px;
  box-shadow: 0 8px 18px -8px rgba(255, 95, 31, 0.6);
}
.pac-paywall-btn-primary:hover { background: #BB3F0F; transform: translateY(-1px); }
.pac-paywall-btn-secondary {
  background: #fff;
  border-color: var(--pac-line);
  color: var(--pac-ink);
}
.pac-paywall-btn-secondary:hover { border-color: var(--pac-ink); }
.pac-paywall-btn-ghost {
  background: transparent;
  color: var(--pac-mute);
}
.pac-paywall-btn-ghost:hover { color: var(--pac-ink); }
.pac-paywall-x {
  position: absolute;
  top: 12px; right: 12px;
  width: 30px; height: 30px;
  border: 0;
  background: transparent;
  border-radius: 8px;
  color: var(--pac-mute);
  cursor: pointer;
  display: grid; place-items: center;
}
.pac-paywall-x:hover { background: var(--pac-bg); color: var(--pac-ink); }

/* ── View more (paginated lists) ── */
.pac-viewmore-wrap { display: flex; justify-content: center; padding: 18px 0 6px; }
.pac-viewmore-btn { display: inline-flex; align-items: center; gap: 8px; padding: 11px 26px; border-radius: 999px; border: 1px solid var(--pac-line); background: #fff; color: var(--pac-ink); font: 600 14px/1 var(--font-body); cursor: pointer; transition: background 0.15s, border-color 0.15s; }
.pac-viewmore-btn:hover { background: var(--pac-bg); border-color: var(--hrb-darkblue-30, #9fb0c8); }
.pac-viewmore-btn svg { transition: transform 0.15s; }
.pac-viewmore-btn:hover svg { transform: translateY(1px); }

/* ── Closed list polish ── */
.pac-closed-card .pac-closed-year-row { display: flex; align-items: center; gap: 12px; padding: 4px 24px 4px; }
.pac-closed-card .pac-iconbtn-soft { width: 30px; height: 30px; }
.pac-closed-year { font: 700 22px/1 var(--font-display); color: var(--pac-ink); margin: 0; letter-spacing: -0.02em; }
.pac-closed-card hr { margin: 16px 24px 0; }

/* ── Employees · Import templates ── */
.pac-pill-bluesoft { background: #E6F2FB; color: #0F6F8F; font-weight: 600; }
.pac-impt-tbl .pac-impt-name { color: var(--pac-orange); font-weight: 600; }
.pac-impt-tbl .pac-impt-date { color: var(--pac-mute); font-size: 11px; font-weight: 400; margin-top: 2px; letter-spacing: 0; }
.pac-impt-tbl tbody td { vertical-align: top; padding-top: 18px; padding-bottom: 18px; }
.pac-impt-tbl .pac-empl-emp-cell { padding-left: 0; }
.pac-impt-tbl .pac-empl-emp-cell .pac-empl-emp-wrap { justify-content: flex-start; align-items: flex-start; }
.pac-impt-tbl .pac-empl-emp-cell .pac-av { margin-top: 1px; }
.pac-impt-tbl .pac-empl-id-name { white-space: normal; }
.pac-fab-fixed { position: fixed; right: 28px; bottom: 28px; z-index: 9999; }

/* ── Payroll Closed Detail ── */
.pac-cld-head {
  display: grid;
  grid-template-columns: auto 1fr auto auto auto;
  align-items: center;
  gap: 24px;
}
/* Closed Detail · Reviews badge — inline (no card wrap) matching real app */
.pac-cld-head { gap: 28px; align-items: center; }
.pac-cld-reviews {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  grid-template-columns: auto;
  justify-items: start;
  gap: 6px;
  padding: 4px 14px 12px 8px;
  background: transparent;
  border-radius: 0;
  min-width: 0;
}
.pac-cld-rev-top { display: inline-flex; align-items: center; gap: 6px; }
.pac-cld-rev-ic { color: var(--pac-orange); display: inline-grid; place-items: center; }
.pac-cld-rev-ic svg { width: 14px !important; height: 14px !important; }
.pac-cld-rev-l { font: 600 13px var(--font-body); color: var(--pac-ink); }
.pac-cld-rev-n {
  font: 700 12px/1 var(--font-display);
  color: var(--pac-ink);
  background: #FFE9CF;
  padding: 4px 9px;
  border-radius: 999px;
  background: #FFE08A;
  padding: 5px 10px;
  border-radius: 7px;
  letter-spacing: 0;
}
.pac-cld-rev-x {
  position: absolute;
  bottom: -8px; left: 22px;
  width: 18px; height: 18px;
  border: 0;
  background: var(--pac-bg);
  border: 1px solid var(--pac-line);
  border-radius: 50%;
  color: var(--pac-ink);
  font: 700 10px var(--font-body);
  display: grid; place-items: center;
  cursor: pointer;
}

.pac-cld-status { gap: 6px; padding-left: 18px; border-left: 0; }
.pac-cld-status-l { font: 600 10.5px var(--font-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--pac-mute); margin-bottom: 2px; }
.pac-cld-status .pac-pill-green { background: #0F8529; color: #fff; padding: 5px 12px; font: 700 12px var(--font-body); border-radius: 6px; }

/* Toast bottom of Interface files page */
.pac-cld-toast {
  position: sticky;
  bottom: 16px;
  margin: 28px auto 0;
  background: var(--pac-ink);
  color: #fff;
  border-radius: 10px;
  padding: 12px 16px 12px 20px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font: 500 13px var(--font-body);
  box-shadow: 0 12px 24px -10px rgba(0,23,56,0.4);
  align-self: center;
  width: fit-content;
}
.pac-cld-toast button { background: rgba(255,255,255,0.10); border: 0; color: #fff; width: 22px; height: 22px; border-radius: 6px; cursor: pointer; display: grid; place-items: center; }
.pac-cld-toast button:hover { background: rgba(255,255,255,0.20); }
.pac-cld-toast button svg { width: 10px !important; height: 10px !important; }

/* Sidebar entity tools — clickable News + Notifications */
.pac-entity-tools .pac-tool { cursor: pointer; transition: color 0.15s, background 0.15s; padding: 6px; border-radius: 8px; display: inline-grid; place-items: center; position: relative; }
.pac-entity-tools .pac-tool:hover { background: rgba(255, 95, 31, 0.10); color: var(--pac-orange); }
.pac-entity-tools .pac-tool.is-on { background: #FFE3D7; color: var(--pac-orange); }
.pac-entity-tools .pac-tool svg { width: 18px !important; height: 18px !important; }

/* Sidebar collapse-button tooltip */
.pac-brand-collapse { position: relative; }
.pac-brand-collapse-tip {
  position: absolute;
  left: calc(100% + 8px);
  top: 50%;
  transform: translateY(-50%);
  background: var(--pac-ink);
  color: #fff;
  padding: 6px 14px;
  border-radius: 8px;
  font: 500 12px var(--font-body);
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  z-index: 60;
  box-shadow: 0 8px 20px -8px rgba(0,23,56,0.4);
  transition: opacity 0.15s;
}
.pac-brand-collapse:hover .pac-brand-collapse-tip { opacity: 1; }

/* ── Slide-in side panel (Notifications, News center) ── */
.pac-spanel-overlay {
  position: absolute;
  top: 0; right: 0; bottom: 0;
  left: 221px;
  background: rgba(0, 23, 56, 0.40);
  backdrop-filter: blur(6px);
  z-index: 70;
  display: flex;
  justify-content: flex-start;
  animation: pacFadeIn 0.22s ease-out;
}
.pac-spanel {
  width: min(320px, 100%);
  margin-left: 0;
  background: #fff;
  border-right: 1px solid var(--pac-line);
  box-shadow: none;
  display: flex;
  flex-direction: column;
  animation: pacSlideR 0.32s var(--ease-emphasized);
  overflow: hidden;
}
@keyframes pacSlideR { from { transform: translateX(-30px); opacity: 0; } to { transform: none; opacity: 1; } }
.pac-spanel-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 17px;
  border-bottom: 1px solid var(--pac-line);
}
.pac-spanel-h h2 { font: 700 22px var(--font-display); color: var(--pac-ink); margin: 0; letter-spacing: -0.018em; }
.pac-spanel-close { width: 38px !important; height: 38px !important; background: var(--pac-ink) !important; color: #fff !important; border-radius: 10px !important; }
.pac-spanel-close svg { width: 13px !important; height: 13px !important; }
.pac-spanel-tabs { display: flex; gap: 32px; padding: 0 17px; border-bottom: 1px solid var(--pac-line); }
.pac-spanel-tabs button {
  background: transparent;
  border: 0;
  padding: 13px 0;
  position: relative;
  cursor: pointer;
  font: 600 14px var(--font-body);
  color: var(--pac-mute);
}
.pac-spanel-tabs button:hover { color: var(--pac-ink); }
.pac-spanel-tabs button.is-on { color: var(--pac-orange); }
.pac-spanel-tabs button.is-on::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 2px;
  background: var(--pac-orange);
  border-radius: 2px;
}
.pac-spanel-body { flex: 1; overflow-y: auto; padding: 8px 17px 32px; }

/* Notifications */
.pac-notif { padding: 18px 0; border-bottom: 1px solid var(--pac-line); }
.pac-notif-top { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.pac-notif-top .pac-av { width: 32px; height: 32px; font-size: 12px; }
.pac-notif-meta { flex: 1; font-size: 12.5px; }
.pac-notif-meta .pac-empl-id-id { color: var(--pac-orange); font-weight: 600; }
.pac-notif-when { color: var(--pac-mute); font-size: 11.5px; margin-top: 2px; letter-spacing: 0; }
.pac-notif-ext { width: 28px !important; height: 28px !important; }
.pac-notif-title { font: 700 15px/1.2 var(--font-display); color: var(--pac-ink); margin: 8px 0 6px; letter-spacing: -0.005em; }
.pac-notif-body { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13px; color: var(--pac-ink); margin-bottom: 6px; }
.pac-notif-body b, .pac-notif-body strong { font-weight: 600; }
.pac-notif-body .pac-pill-green { background: #0F8529; color: #fff; padding: 4px 12px; font: 700 11px var(--font-body); border-radius: 6px; }
.pac-notif-reason { font-size: 13px; color: var(--pac-ink2); }
.pac-notif-reason span { color: var(--pac-mute); }

/* News center timeline */
.pac-news-body { padding-top: 16px; }
.pac-news-tl { position: relative; }
.pac-news-item { padding-bottom: 32px; position: relative; }
.pac-news-top { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.pac-news-ic { width: 30px; height: 30px; border-radius: 50%; background: #FFE3D7; color: var(--pac-orange); display: grid; place-items: center; }
.pac-news-ic svg { width: 14px !important; height: 14px !important; }
.pac-news-title { font: 700 15px var(--font-display) !important; color: var(--pac-ink); flex: 1; letter-spacing: -0.005em; }
.pac-news-date { font: 600 12px var(--font-body) !important; color: var(--pac-ink2); }
.pac-news-row {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 10px;
  position: relative;
}
.pac-news-row::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 16px;
  bottom: -32px;
  width: 1px;
  border-left: 1.5px dashed var(--pac-line-strong);
}
.pac-news-item:last-child .pac-news-row::before { display: none; }
.pac-news-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--pac-line-strong); margin: 4px 10px; align-self: flex-start; position: relative; z-index: 1; }
.pac-news-h2 { font: 700 14px var(--font-display) !important; color: var(--pac-ink); margin-bottom: 8px; }
.pac-news-body-p { font: 400 13px/1.55 var(--font-body) !important; color: var(--pac-ink2); margin: 0; }
.pac-news-learn { display: inline-block; margin-top: 12px; color: var(--pac-orange); font: 600 12.5px var(--font-body) !important; cursor: pointer; }
.pac-news-learn span { margin-left: 4px; transition: margin-left 0.15s; }
.pac-news-learn:hover span { margin-left: 8px; }
.pac-news-more { text-align: center; padding: 16px 0; }
.pac-news-more a { font: 500 13px var(--font-body); cursor: pointer; }
.pac-news-more a:hover { color: var(--pac-orange); }

/* Leave transaction detail panel */
.pac-leave-detail-overlay {
  position: absolute;
  inset: 0;
  background: transparent;
  z-index: 70;
  display: flex;
  justify-content: flex-end;
  pointer-events: none;
  animation: pacFadeIn 0.22s ease-out;
}
.pac-leave-detail-overlay > * { pointer-events: auto; }
.pac-leave-detail {
  width: min(440px, 90%);
  background: #fff;
  border-left: 1px solid var(--pac-line);
  border-radius: 16px 0 0 16px;
  margin: 12px 12px 12px 0;
  display: flex;
  flex-direction: column;
  animation: pacSlideL 0.32s var(--ease-emphasized);
  overflow-y: auto;
  box-shadow: 0 24px 48px -16px rgba(0,23,56,0.32);
}
@keyframes pacSlideL { from { transform: translateX(30px); opacity: 0; } to { transform: none; opacity: 1; } }
.pac-leave-detail-h { display: flex; justify-content: flex-end; padding: 14px 14px 0; }
.pac-leave-detail-close { width: 38px !important; height: 38px !important; background: var(--pac-ink) !important; color: #fff !important; border-radius: 10px !important; }
.pac-leave-detail-close svg { width: 13px !important; height: 13px !important; }
.pac-leave-detail-body { padding: 4px 28px 28px; }
.pac-leave-detail-title { font: 700 22px var(--font-display); color: var(--pac-ink); margin: 0 0 22px; letter-spacing: -0.015em; }
.pac-leave-detail-meta { display: flex; gap: 10px; align-items: baseline; margin-bottom: 22px; font: 400 13px var(--font-body); color: var(--pac-ink); }
.pac-leave-detail-meta-l { color: var(--pac-mute); font-weight: 500; }
.pac-leave-detail-meta b { font-weight: 600; }

/* Mini calendar */
.pac-leave-cal { border-top: 1px solid var(--pac-line); border-bottom: 1px solid var(--pac-line); padding: 18px 0; }
.pac-leave-cal-head { display: flex; align-items: center; justify-content: center; gap: 28px; margin-bottom: 16px; font: 700 16px var(--font-display); color: var(--pac-ink); }
.pac-leave-cal-nav { background: transparent; border: 0; color: var(--pac-mute); cursor: pointer; font: 700 16px var(--font-body); padding: 4px 8px; }
.pac-leave-cal-nav:hover { color: var(--pac-orange); }
.pac-leave-cal-month { letter-spacing: -0.005em; }
.pac-leave-cal-wk, .pac-leave-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.pac-leave-cal-wk { padding: 0 4px 8px; font: 600 11px var(--font-body); color: var(--pac-mute); text-align: center; }
.pac-leave-cal-d {
  display: grid; place-items: center;
  height: 36px;
  font: 500 13px var(--font-body);
  color: var(--pac-ink);
  border-radius: 8px;
}
.pac-leave-cal-d.is-range {
  background: var(--pac-bg);
  color: var(--pac-ink2);
}

/* Toggle + list */
.pac-leave-detail-toggle {
  display: flex; align-items: center; justify-content: space-between;
  width: 100%;
  padding: 18px 4px;
  background: transparent;
  border: 0;
  cursor: pointer;
  font: 700 14px var(--font-display);
  color: var(--pac-ink);
}
.pac-leave-toggle-chev { font-weight: 700; color: var(--pac-mute); font-size: 14px; }
.pac-leave-detail-list { padding: 0 0 8px; }
.pac-leave-detail-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 8px 0; font-size: 13px; color: var(--pac-ink); }
.pac-leave-detail-row-l { font-size: 13px; }
.pac-leave-detail-row-l b { color: var(--pac-orange); font-weight: 600; }
.pac-leave-detail-row-v { color: var(--pac-ink); }
.pac-leave-detail-row .pac-pill-grey { background: var(--pac-bg); color: var(--pac-ink); font: 600 11px var(--font-mono); padding: 4px 10px; letter-spacing: 0; }
.pac-cld-title h1 { font: 700 22px/1.2 var(--font-display); margin: 0; letter-spacing: -0.015em; }
.pac-cld-status { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; border-left: 1px solid var(--pac-line); padding-left: 16px; }
.pac-cld-status-l { font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; }
.pac-cld-tabs { display: flex; gap: 18px; }
.pac-cld-tab {
  background: transparent;
  border: 0;
  font: 600 14px/1 var(--font-body);
  color: var(--pac-mute);
  cursor: pointer;
  padding: 8px 2px;
  position: relative;
}
.pac-cld-tab:hover { color: var(--pac-ink); }
.pac-cld-tab.is-on { color: var(--pac-orange); }
.pac-cld-tab.is-on::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -2px;
  height: 2px;
  background: var(--pac-orange);
  border-radius: 2px;
}
.pac-cld-close {
  width: 40px !important; height: 40px !important;
  background: var(--pac-ink) !important;
  color: #fff !important;
  border-radius: 10px !important;
}
.pac-cld-close svg { width: 14px !important; height: 14px !important; }

/* tiles */
.pac-cld-tiles {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
}
.pac-cld-tile {
  background: #fff;
  border: 1px solid var(--pac-line);
  border-radius: 12px;
  padding: 18px 14px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
  min-height: 140px;
  justify-content: center;
}
.pac-cld-tile-ic {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: #F0F3F8;
  color: var(--pac-ink2);
  display: grid; place-items: center;
}
.pac-cld-tile-ic svg { width: 20px !important; height: 20px !important; }
.pac-cld-tile-n {
  display: grid; place-items: center;
  min-width: 38px;
  padding: 4px 10px;
  border-radius: 6px;
  background: var(--pac-ink);
  color: #fff;
  font: 700 14px/1 var(--font-mono);
  letter-spacing: 0;
}
.pac-cld-tile-l { font: 500 11.5px/1.35 var(--font-body); color: var(--pac-ink2); text-wrap: balance; max-width: 16ch; }
.pac-cld-tile-empty { background: #F0F3F8; border-style: dashed; padding: 16px; font-size: 12px; }

/* period summary reports */
.pac-cld-reports .pac-card-h2 .pac-tpl-count { font-size: 12px; }
.pac-cld-dl {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 0;
  color: var(--pac-ink);
  font: 600 13px var(--font-body);
  cursor: pointer;
}
.pac-cld-dl:hover { color: var(--pac-orange); }
.pac-cld-dl-ic { width: 26px; height: 26px; border-radius: 50%; background: #FFE3D7; color: var(--pac-orange); display: grid; place-items: center; }
.pac-cld-dl-ic svg { width: 13px !important; height: 13px !important; }
.pac-cld-reports-head {
  display: grid;
  grid-template-columns: 1fr 160px;
  padding: 8px 0;
  margin-top: 14px;
  border-top: 1px solid var(--pac-line);
  border-bottom: 1px solid var(--pac-line);
  font: 600 11px var(--font-body);
  letter-spacing: 0.06em;
  color: var(--pac-ink);
  text-transform: uppercase;
}
.pac-cld-reports-head span:last-child { text-align: right; }
.pac-cld-report-row {
  display: grid;
  grid-template-columns: 30px 1fr 160px;
  gap: 12px;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px solid var(--pac-line);
}
.pac-cld-report-row:last-child { border-bottom: 0; }
.pac-cld-report-ic {
  width: 28px; height: 28px;
  border-radius: 6px;
  background: #FFE3D7;
  color: var(--pac-orange);
  display: grid; place-items: center;
}
.pac-cld-report-ic svg { width: 14px !important; height: 14px !important; }
.pac-cld-report-name {
  color: var(--pac-orange);
  font: 600 13px var(--font-body);
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pac-cld-report-name:hover { text-decoration: underline; }
.pac-cld-report-date { color: var(--pac-ink); text-align: right; font-size: 12.5px; }

/* payrolls row in closed detail */
.pac-cld-pr .pac-card-h2 > span:first-child { display: inline-flex; align-items: center; gap: 8px; }
.pac-cld-add {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: transparent;
  border: 1px dashed var(--pac-line-strong);
  color: var(--pac-mute);
  cursor: pointer;
  display: inline-grid; place-items: center;
  margin-left: 4px;
}
.pac-cld-add:hover { border-color: var(--pac-orange); color: var(--pac-orange); border-style: solid; }
.pac-cld-add svg { width: 10px !important; height: 10px !important; }
.pac-collapse-h { font: 600 14px var(--font-body); color: var(--pac-ink); margin: 14px 0 0; cursor: pointer; user-select: none; }
.pac-cld-pr-row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 24px;
  padding: 18px 0 4px;
  border-top: 1px solid var(--pac-line);
  margin-top: 12px;
}
.pac-cld-pr-l { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pac-cld-pr-ref { color: var(--pac-orange); font-weight: 600; letter-spacing: 0; font-size: 13px; }
.pac-cld-pr-name { font: 700 16px/1.2 var(--font-display); color: var(--pac-ink); margin-top: 4px; letter-spacing: -0.005em; }
.pac-cld-pr-sub { color: var(--pac-mute); font-size: 12.5px; margin-top: 3px; }
.pac-cld-pr-r { display: flex; align-items: center; gap: 14px; position: relative; }
.pac-cld-pr-badge { display: inline-flex; align-items: center; gap: 5px; padding: 4px 8px; border-radius: 7px; background: #F0F3F8; }
.pac-cld-pr-badge-ic { color: var(--pac-ink2); display: inline-grid; place-items: center; }
.pac-cld-pr-badge-ic svg { width: 14px !important; height: 14px !important; }
.pac-cld-pr-badge-n {
  display: inline-grid; place-items: center;
  min-width: 20px; height: 18px;
  background: var(--pac-ink);
  color: #fff;
  border-radius: 5px;
  font: 700 11px var(--font-mono);
  padding: 0 6px;
  letter-spacing: 0;
}
.pac-cld-pr-view { font-weight: 600; }
.pac-cld-pr-lt { color: var(--pac-mute) !important; }
.pac-cld-pr-lt:hover { color: var(--pac-orange) !important; }
.pac-cld-pr-menu-wrap { position: relative; }
.pac-cld-pr-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 220px;
  background: #fff;
  border: 1px solid var(--pac-line);
  border-radius: 10px;
  box-shadow: 0 16px 32px -10px rgba(0,23,56,0.22);
  padding: 6px 0;
  z-index: 10;
}
.pac-cld-pr-menu-h {
  padding: 8px 16px;
  font: 700 11px var(--font-body);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--pac-mute);
}
.pac-cld-pr-menu-i {
  display: block;
  width: 100%;
  padding: 10px 16px;
  border: 0;
  background: transparent;
  text-align: left;
  font: 500 13px var(--font-body);
  color: var(--pac-ink);
  cursor: pointer;
}
.pac-cld-pr-menu-i:hover { background: var(--pac-bg); color: var(--pac-orange); }

/* generic modal */
.pac-modal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 23, 56, 0.55);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  z-index: 60;
  display: grid; place-items: center;
  padding: 24px;
  animation: pacFadeIn 0.22s ease-out both;
}
.pac-modal {
  width: min(520px, calc(100% - 32px));
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 28px 56px -20px rgba(0,23,56,0.45);
  animation: pacModalIn 0.3s var(--ease-emphasized) both;
  overflow: hidden;
}
.pac-modal-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px 16px;
  border-bottom: 1px solid var(--pac-line);
}
.pac-modal-h h3 { font: 700 18px/1 var(--font-display); margin: 0; color: var(--pac-ink); letter-spacing: -0.015em; }
.pac-modal-x {
  width: 32px; height: 32px;
  background: var(--pac-ink);
  color: #fff;
  border: 0;
  border-radius: 9px;
  cursor: pointer;
  display: grid; place-items: center;
}
.pac-modal-x svg { width: 12px !important; height: 12px !important; }
.pac-modal-b { padding: 24px; }
.pac-modal-l { font: 500 13.5px/1.4 var(--font-body); color: var(--pac-ink2); margin-bottom: 18px; }
.pac-modal-req { color: var(--pac-orange); font-weight: 700; }
.pac-modal-radios { display: flex; flex-direction: column; gap: 4px; }
.pac-modal-radio {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.15s;
}
.pac-modal-radio:hover { background: var(--pac-bg); }
.pac-modal-radio input { position: absolute; opacity: 0; pointer-events: none; }
.pac-modal-radio-dot {
  width: 18px; height: 18px;
  border-radius: 50%;
  border: 2px solid var(--pac-line-strong);
  flex: none;
  position: relative;
  transition: border-color 0.15s;
}
.pac-modal-radio.is-on .pac-modal-radio-dot { border-color: var(--pac-orange); background: var(--pac-orange); }
.pac-modal-radio.is-on .pac-modal-radio-dot::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  background: #fff;
}
.pac-modal-radio span:last-child { font: 500 14px var(--font-body); color: var(--pac-ink); }
.pac-modal-f {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  padding: 16px 24px 20px;
  border-top: 1px solid var(--pac-line);
}
.pac-modal-btn {
  padding: 11px 22px;
  border-radius: 10px;
  font: 600 13px var(--font-body);
  border: 0;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, transform 0.15s;
}
.pac-modal-btn-secondary { background: transparent; color: var(--pac-ink); }
.pac-modal-btn-secondary:hover { color: var(--pac-orange); }
.pac-modal-btn-primary { background: var(--pac-orange); color: #fff; box-shadow: 0 8px 18px -8px rgba(255,95,31,0.6); }
.pac-modal-btn-primary:hover { background: #BB3F0F; transform: translateY(-1px); }

/* ── Payroll Run · Validations · Calc toggle ── */
.pac-calc-row { display: flex; align-items: center; justify-content: space-between; margin-top: 4px; }
.pac-calc-h { font: 700 18px/1 var(--font-display); color: var(--pac-ink); margin: 0; letter-spacing: -0.01em; }
.pac-calc-toggle { display: inline-flex; align-items: center; gap: 0; padding: 4px; background: #fff; border: 1px solid var(--pac-line); border-radius: 999px; }
.pac-calc-toggle button { background: transparent; border: 0; padding: 7px 18px; border-radius: 999px; cursor: pointer; font: 600 13px var(--font-body); color: var(--pac-mute); }
.pac-calc-toggle button.is-on { background: #FFF1EA; color: var(--pac-orange); }

/* AI Insights cards row */
.pac-aii-card .pac-aii-ic { width: 38px; height: 38px; border-radius: 50%; background: #F3EBFD; color: #9b6bff; display: grid; place-items: center; }
.pac-aii-card .pac-aii-ic svg { width: 18px !important; height: 18px !important; }
.pac-aii-h { display: flex; align-items: center; gap: 10px; padding: 14px 18px; border-bottom: 1px solid var(--pac-line); }
.pac-aii-h .pac-aii-chev { color: var(--pac-mute); font-weight: 700; }
.pac-aii-h h3 { font: 700 16px/1 var(--font-display); margin: 0; color: var(--pac-ink); letter-spacing: -0.01em; }
.pac-aii-toggle { margin-left: auto; display: inline-flex; padding: 3px; border-radius: 8px; background: #F0F3F8; }
.pac-aii-toggle button { background: transparent; border: 0; padding: 6px 14px; border-radius: 6px; cursor: pointer; font: 600 12.5px var(--font-body); color: var(--pac-mute); }
.pac-aii-toggle button.is-on { background: #fff; color: var(--pac-orange); box-shadow: 0 1px 2px rgba(0,23,56,0.08); }

.pac-aii-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; padding: 18px; }
.pac-aii-card { display: flex; flex-direction: column; gap: 8px; padding: 22px; border: 1px solid var(--pac-line); border-radius: 14px; background: #fff; position: relative; min-height: 280px; }
.pac-aii-summary { border-color: rgba(155,107,255,0.4); background: linear-gradient(180deg, #FAF7FF, #fff 60%); }
.pac-aii-name { font: 700 18px/1.2 var(--font-display); color: var(--pac-ink); text-align: center; margin-top: 6px; letter-spacing: -0.01em; }
.pac-aii-card .pac-aii-ic { margin: 0 auto; }
.pac-aii-pill { align-self: center; margin-top: 4px; }
.pac-aii-sub { text-align: center; color: var(--pac-ink2); font: 500 12.5px var(--font-body); margin-top: 4px; }
.pac-aii-desc { text-align: center; color: var(--pac-ink2); font: 400 12.5px/1.5 var(--font-body); margin: 6px 8px; }
.pac-aii-list { list-style: none; margin: 14px 12px 0; padding: 0; display: flex; flex-direction: column; gap: 10px; border-top: 1px solid var(--pac-line); padding-top: 14px; font-size: 12.5px; color: var(--pac-ink); }
.pac-aii-list li { display: grid; grid-template-columns: 18px 1fr auto; gap: 8px; align-items: center; }
.pac-aii-list li > span:nth-child(2) { font-size: 12.5px; color: var(--pac-ink); }
.pac-aii-count { display: inline-grid; place-items: center; min-width: 28px; height: 22px; padding: 0 10px; border-radius: 6px; font: 700 11.5px/1 var(--font-mono); letter-spacing: 0; }
.pac-aii-count-ink { background: var(--pac-bg); color: var(--pac-ink); }
.pac-aii-count-yellow { background: #FFF4D6; color: #7a5300; }
.pac-aii-count-red { background: #FDE2E2; color: #D22A2A; }
.pac-aii-count-green { background: #E8F6EC; color: #0F8529; }
.pac-aii-list-ic { display: inline-grid; place-items: center; }
.pac-aii-list-ic svg { width: 14px !important; height: 14px !important; }
.pac-aii-cta { display: block; margin: auto auto 0; background: transparent; border: 0; color: var(--pac-orange); cursor: pointer; font: 600 13px var(--font-body); padding: 10px 18px; }
.pac-aii-cta:hover { background: var(--pac-bg); border-radius: 6px; }
.pac-aii-cta.is-mute { color: var(--pac-mute); cursor: not-allowed; }
.pac-aii-foot { text-align: center; font-size: 11px; color: var(--pac-mute); margin-top: 14px; }
.pac-aii-empty-ic { width: 44px; height: 44px; border-radius: 50%; background: #FFF8E5; color: #b27a00; display: grid; place-items: center; margin: 14px auto 0; }
.pac-aii-empty-ic svg { width: 20px !important; height: 20px !important; }
.pac-aii-empty-msg { max-width: 28ch; margin-top: 16px; }
.pac-aii-skel { display: flex; flex-direction: column; gap: 8px; padding: 16px 14px; }
.pac-aii-skel span { display: block; height: 10px; background: linear-gradient(90deg, #ECEFF4 0%, #F8FAFC 50%, #ECEFF4 100%); background-size: 200% 100%; border-radius: 4px; animation: pacSkel 1.4s ease infinite; }
@keyframes pacSkel { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.pac-aii-spinner { width: 60px; height: 60px; margin: 14px auto 6px; position: relative; }
.pac-aii-spin-ring { position: absolute; inset: 0; border-radius: 50%; border: 3px solid #F0F3F8; border-top-color: var(--pac-orange); animation: pacSpin 1.2s linear infinite; }
.pac-aii-spin-ic { position: absolute; inset: 0; display: grid; place-items: center; color: var(--pac-orange); }
.pac-aii-spin-ic svg { width: 18px !important; height: 18px !important; }
@keyframes pacSpin { to { transform: rotate(360deg); } }

.pac-pill-greensoft { background: #E8F6EC; color: #0F6620; }
.pac-pill-perm { background: #FFE3D7; color: #A53F0F; }
.pac-pill-system { background: #E6F2FB; color: #0F6F8F; }
.pac-pill-ink { background: var(--pac-ink); color: #fff; font: 600 10px var(--font-body); }
.pac-pill-orangesoft { background: #FFE3D7; color: #A53F0F; font-size: 11px; }

/* Rules with findings cards */
.pac-rwf-card { padding: 22px; }
.pac-rwf-tools { display: inline-flex; align-items: center; gap: 6px; }
.pac-rwf-tools .pac-filter-pill { font-size: 11.5px; padding: 5px 12px; }
.pac-rwf-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; margin-top: 16px; }
.pac-rwf-card-i { padding: 18px; border: 1px solid var(--pac-line); border-radius: 12px; background: #fff; display: flex; flex-direction: column; gap: 10px; }
.pac-rwf-card-tag { font-size: 10px; color: var(--pac-mute); letter-spacing: 0.06em; text-transform: uppercase; }
.pac-rwf-card-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pac-rwf-card-name { font: 700 15px/1.2 var(--font-display); color: var(--pac-ink); letter-spacing: -0.005em; }
.pac-rwf-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.pac-rwf-tag { padding: 3px 9px; border-radius: 6px; background: #E6F2FB; color: #0F6F8F; font: 600 11px var(--font-mono); letter-spacing: 0; }
.pac-rwf-desc { font: 400 12.5px/1.5 var(--font-body); color: var(--pac-ink2); margin: 0; }
.pac-rwf-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 12px; border-top: 1px solid var(--pac-line); margin-top: auto; }
.pac-rwf-emp { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pac-rwf-emp-l { font-size: 11.5px; color: var(--pac-ink); }
.pac-rwf-avatars { display: inline-flex; align-items: center; }
.pac-rwf-avatars .pac-av { width: 22px; height: 22px; font-size: 9px; margin-left: -6px; border: 2px solid #fff; }
.pac-rwf-avatars .pac-av:first-child { margin-left: 0; }
.pac-rwf-extra { display: inline-grid; place-items: center; min-width: 24px; height: 22px; padding: 0 6px; margin-left: -6px; border: 2px solid #fff; border-radius: 50%; background: var(--pac-ink); color: #fff; font: 700 10px var(--font-mono); letter-spacing: 0; }

/* ── Overlay (full-page in-prototype modal) ── */
.pac-ovr {
  position: fixed;
  inset: 0;
  background: var(--pac-bg);
  z-index: 50;
  display: flex;
  flex-direction: column;
  animation: pacOvrIn 0.35s var(--ease-emphasized);
  overflow-y: auto;
}
@keyframes pacOvrIn { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: none; } }
.pac-ovr-head {
  display: flex; align-items: center; gap: 16px;
  padding: 18px 32px;
  background: #fff;
  border-bottom: 1px solid var(--pac-line);
  position: sticky; top: 0; z-index: 1;
}
.pac-ovr-crumb { display: flex; align-items: center; gap: 14px; flex: 1; min-width: 0; }
.pac-ovr-entity { font: 600 13px var(--font-body); color: var(--pac-mute); }
.pac-ovr-divider { width: 1px; height: 22px; background: var(--pac-line); }
.pac-ovr-title-l { display: flex; align-items: center; gap: 8px; font: 700 18px var(--font-display); color: var(--pac-ink); letter-spacing: -0.015em; min-width: 0; }
.pac-ovr-title-mute { color: var(--pac-ink); font-weight: 700; }
.pac-ovr-title-sep { color: var(--pac-mute); margin: 0 2px; }
.pac-ovr-ref { color: var(--pac-orange); font-size: 12px; font-weight: 600; margin-left: 4px; }
.pac-ovr-close {
  width: 38px; height: 38px;
  border: 0;
  background: var(--pac-ink);
  color: #fff;
  border-radius: 10px;
  cursor: pointer;
  display: grid; place-items: center;
}
.pac-ovr-close svg { width: 14px !important; height: 14px !important; }
.pac-ovr-body { padding: 28px 32px 60px; max-width: 1280px; margin: 0 auto; width: 100%; flex: 1; min-height: 0; display: flex; flex-direction: column; justify-content: safe center; }
.pac-ovr-page { display: flex; flex-direction: column; gap: 32px; }
.pac-ovr-title { position: relative; padding-bottom: 18px; }
.pac-ovr-title h2 { font: 700 26px/1.2 var(--font-display); color: var(--pac-ink); margin: 0 0 8px; letter-spacing: -0.018em; }
.pac-ovr-title p { font: 400 14px/1.5 var(--font-body); color: var(--pac-ink2); margin: 0; max-width: 60ch; }
.pac-ovr-search { width: 38px; height: 38px; background: var(--pac-ink) !important; color: #fff !important; border-radius: 10px !important; position: absolute; right: 0; top: 0; }
.pac-ovr-search svg { width: 14px !important; height: 14px !important; }

.pac-ovr-section { display: flex; flex-direction: column; gap: 12px; }
.pac-ovr-section-h { font: 700 18px/1.2 var(--font-display); margin: 0; color: var(--pac-ink); letter-spacing: -0.015em; }
.pac-ovr-tbl { width: 100%; border-collapse: collapse; font: 400 13px var(--font-body); }
.pac-ovr-tbl th { text-align: left; padding: 10px 14px; font: 600 11px var(--font-body); color: var(--pac-mute); letter-spacing: 0.06em; text-transform: uppercase; border-bottom: 1px solid var(--pac-line); }
.pac-ovr-tbl td { padding: 14px; border-bottom: 1px solid var(--pac-line); vertical-align: middle; }
.pac-ovr-name { color: var(--pac-orange); font-weight: 600; margin-right: 10px; }
.pac-ovr-tag { background: #E6F2FB; color: #0F6F8F; margin-right: 6px; vertical-align: middle; }
.pac-ovr-desc { color: var(--pac-ink2); }
.pac-ovr-expand { background: transparent; border: 0; cursor: pointer; color: var(--pac-mute); font: 700 12px var(--font-body); }
.pac-ovr-expanded { background: #FAF9FF; padding: 0 !important; }
.pac-ovr-detail { padding: 22px; border-left: 3px solid #9b6bff; margin: 4px; border-radius: 6px; }
.pac-ovr-detail-h { font: 700 14px var(--font-display); color: var(--pac-ink); margin: 14px 0 6px; }
.pac-ovr-detail-h:first-child { margin-top: 0; }
.pac-ovr-detail-v { font: 400 13.5px/1.5 var(--font-body); color: var(--pac-ink2); margin-bottom: 8px; }
.pac-ovr-params { width: 100%; border-collapse: collapse; margin-top: 8px; }
.pac-ovr-params th { text-align: left; font: 700 12.5px var(--font-body); color: var(--pac-ink); padding: 8px 14px; border-bottom: 1px solid var(--pac-line); }
.pac-ovr-params td { padding: 8px 14px; border-bottom: 1px solid var(--pac-line); color: var(--pac-ink); }
.pac-ovr-action { margin-top: 16px; background: #F3EBFD; border-radius: 8px; padding: 16px 20px; }
.pac-ovr-action .pac-ovr-detail-h { margin-top: 0; }
.pac-ovr-action p { margin: 0; font: 400 13px/1.5 var(--font-body); color: var(--pac-ink); }
.pac-ovr-detail-card { padding: 22px; border: 1px solid #C9B9F0; background: #FBF9FF; border-radius: 12px; }
.pac-ovr-emp-h { display: flex; align-items: center; justify-content: space-between; }
.pac-ovr-row { cursor: pointer; transition: background 0.15s; }
.pac-ovr-row:hover { background: var(--pac-bg); }
.pac-ovr-row.is-open { background: #FAFBFE; }
.pac-ovr-row.pac-ovr-row-pass.is-open { background: #F2FBF4; }
.pac-ovr-emp-row.is-open { background: #FFF9F6; }
.pac-ovr-expand { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 6px; color: var(--pac-mute); font: 700 12px var(--font-body); background: transparent; }
.pac-ovr-row.is-open .pac-ovr-expand { color: var(--pac-orange); background: rgba(255,95,31,0.08); }

/* Nested employees-with-finding section inside expanded rule */
.pac-ovr-sub-emp { margin-top: 22px; padding: 0; background: transparent; border: 0; border-radius: 0; }
.pac-ovr-sub-emp-h { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.pac-ovr-sub-emp-h .pac-ovr-section-h { font: 700 16px var(--font-display); }
.pac-ovr-sub-emp .pac-ovr-emp-tbl { background: #fff; border: 1px solid var(--pac-line); border-radius: 10px; overflow: hidden; }
.pac-ovr-sub-emp .pac-ovr-emp-tbl th { background: #fff; }

/* Per-employee expanded detail */
.pac-ovr-expanded-emp { background: #FFF9F6 !important; padding: 0 !important; }
.pac-ovr-expanded-emp .pac-ovr-detail-emp { border-left: 3px solid var(--pac-orange); background: #FFF9F6; margin: 4px; border-radius: 6px; padding: 22px; }
.pac-ovr-action-emp { background: #FFE3D7 !important; }
.pac-ovr-detail-emp .pac-ovr-action p { color: var(--pac-ink); }

/* Statutory overlay sub-rules */
.pac-ovr-subrules { display: flex; flex-direction: column; gap: 1px; background: var(--pac-line); border: 1px solid var(--pac-line); border-radius: 12px; overflow: hidden; }
.pac-ovr-subrule { background: #fff; }
.pac-ovr-subrule-h { display: grid; grid-template-columns: 18px 280px 1fr auto; gap: 16px; align-items: center; padding: 16px 18px; width: 100%; border: 0; background: transparent; cursor: pointer; text-align: left; }
.pac-ovr-subrule-h:hover { background: var(--pac-bg); }
.pac-ovr-subrule-chev { color: var(--pac-mute); font-weight: 700; }
.pac-ovr-subrule-name { font: 600 13.5px var(--font-body); color: var(--pac-ink); }
.pac-ovr-subrule-short { font-size: 12.5px; color: var(--pac-ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pac-ovr-subrule-avs { display: inline-flex; align-items: center; }
.pac-ovr-subrule-avs .pac-av { width: 22px; height: 22px; font-size: 9px; margin-left: -6px; border: 2px solid #fff; }
.pac-ovr-subrule-avs .pac-av:first-child { margin-left: 0; }
.pac-ovr-foot { display: flex; justify-content: center; padding-top: 12px; }
.pac-ovr-close-btn { border: 1px solid var(--pac-line) !important; padding: 10px 32px !important; border-radius: 999px !important; }

/* Create ad-hoc rule overlay */
.pac-ovr-create { gap: 24px; }
.pac-create-hero { text-align: center; padding: 40px 20px; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.pac-create-ic { width: 60px; height: 60px; border-radius: 50%; background: #F3EBFD; color: #9b6bff; display: grid; place-items: center; }
.pac-create-ic svg { width: 26px !important; height: 26px !important; }
.pac-create-hero h2 { font: 700 24px/1.2 var(--font-display); color: var(--pac-ink); margin: 0; letter-spacing: -0.018em; }
.pac-create-hero p { font: 400 14px/1.5 var(--font-body); color: var(--pac-ink2); max-width: 56ch; margin: 0; }
.pac-create-input-wrap {
  position: relative;
  width: 100%;
  max-width: 600px;
  margin-top: 12px;
  border: 1.5px solid #C9B9F0;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 0 0 6px rgba(155,107,255,0.10), 0 12px 24px -16px rgba(155,107,255,0.40);
  display: flex;
  align-items: center;
  padding: 4px 4px 4px 18px;
}
.pac-create-input-wrap input { flex: 1; border: 0; outline: 0; padding: 14px 0; font: 400 14px var(--font-body); color: var(--pac-ink); background: transparent; }
.pac-create-input-wrap input::placeholder { color: var(--pac-mute); }
.pac-create-send { width: 38px; height: 38px; border: 1px solid var(--pac-line); background: #fff; border-radius: 50%; color: var(--pac-mute); cursor: pointer; display: grid; place-items: center; }
.pac-create-send:hover { color: var(--pac-orange); border-color: var(--pac-orange); }
.pac-create-send svg { width: 14px !important; height: 14px !important; }
.pac-create-ready { display: inline-flex; align-items: center; gap: 8px; background: #F0F3F8; border: 0; padding: 10px 18px; border-radius: 999px; cursor: pointer; font: 500 13px var(--font-body); color: var(--pac-ink); }
.pac-create-ready:hover { background: #E3E7F0; }
.pac-create-ready span { display: inline-grid; place-items: center; color: var(--pac-mute); }
.pac-create-ready span svg { width: 12px !important; height: 12px !important; }
.pac-create-cancel { color: var(--pac-mute); cursor: pointer; font: 500 13px var(--font-body); }
.pac-create-cancel:hover { color: var(--pac-orange); }

/* Create rule · generating state */
.pac-create-loading .pac-create-gen { margin-top: 10px; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.pac-create-gen-h { font: 600 16px var(--font-body); color: var(--pac-ink); }
.pac-create-gen-sub { font: 400 13px var(--font-body); color: var(--pac-ink2); }
.pac-create-gen-spinner { width: 60px; height: 60px; position: relative; margin-top: 6px; }
.pac-create-gen-ring { position: absolute; inset: 0; border-radius: 50%; border: 3px solid #F0F3F8; border-top-color: #9b6bff; animation: pacSpin 1.1s linear infinite; }
.pac-create-gen-ic { position: absolute; inset: 0; display: grid; place-items: center; color: #9b6bff; }
.pac-create-gen-ic svg { width: 20px !important; height: 20px !important; }
.pac-create-input-wrap.is-disabled { opacity: 0.55; pointer-events: none; }

/* Create rule · ready state */
.pac-ovr-create-ready { gap: 28px; align-items: stretch; max-width: 900px; margin: 0 auto; }
.pac-create-success {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 16px;
  align-items: flex-start;
  padding: 16px 22px;
  border: 1px solid #B5DCC2;
  background: #F2FBF4;
  border-radius: 14px;
}
.pac-create-success-ic { font-size: 22px; line-height: 1; color: #0F8529; }
.pac-create-success b { color: #0F8529; font: 700 14px var(--font-display); display: block; margin-bottom: 4px; }
.pac-create-success p { color: var(--pac-ink); font: 400 13.5px/1.5 var(--font-body); margin: 0; }
.pac-create-result { display: flex; flex-direction: column; gap: 4px; }
.pac-create-r-h { font: 700 17px/1.2 var(--font-display); color: var(--pac-ink); margin: 18px 0 8px; letter-spacing: -0.01em; }
.pac-create-r-h:first-child { margin-top: 0; }
.pac-create-r-v { font: 400 14px/1.55 var(--font-body); color: var(--pac-ink2); margin: 0; }
.pac-ovr-create-ready .pac-create-input-wrap { max-width: 100%; margin: 16px 0 0; }
.pac-ovr-create-ready .pac-create-ready { align-self: center; margin-top: 4px; }
.pac-create-foot { display: flex; justify-content: flex-end; align-items: center; gap: 16px; padding-top: 12px; border-top: 1px solid var(--pac-line); margin-top: 12px; }
.pac-create-foot .pac-create-cancel { padding: 10px 16px; }
.pac-create-foot .pac-modal-btn-primary { padding: 11px 32px !important; border-radius: 10px !important; }

/* Library */
.pac-library { padding: 22px 24px; background: #fff; border: 1.5px solid #C9B9F0; border-radius: 16px; box-shadow: 0 0 0 6px rgba(155,107,255,0.08); }
.pac-library-h { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.pac-library-h h3 { font: 700 20px/1.2 var(--font-display); color: var(--pac-ink); margin: 0 0 6px; letter-spacing: -0.015em; }
.pac-library-h p { font: 400 13px/1.5 var(--font-body); color: var(--pac-ink2); margin: 0; max-width: 70ch; }
.pac-library-x { width: 24px; height: 24px; border: 0; background: transparent; color: var(--pac-mute); cursor: pointer; border-radius: 6px; display: grid; place-items: center; }
.pac-library-x:hover { background: var(--pac-bg); }
.pac-library-x svg { width: 11px !important; height: 11px !important; }
.pac-library-search { display: flex; align-items: center; gap: 10px; padding: 11px 16px; background: var(--pac-bg); border-radius: 8px; margin: 18px 0 4px; }
.pac-library-search span { color: var(--pac-mute); display: inline-grid; place-items: center; }
.pac-library-search span svg { width: 14px !important; height: 14px !important; }
.pac-library-search input { flex: 1; border: 0; background: transparent; outline: 0; font: 400 13px var(--font-body); color: var(--pac-ink); }
.pac-library-list { display: flex; flex-direction: column; }
.pac-library-item { border-bottom: 1px solid var(--pac-line); }
.pac-library-item.is-open { background: #FAFBFE; }
.pac-library-item:last-child { border-bottom: 0; }
.pac-library-item-h { display: grid; grid-template-columns: 1fr auto auto; gap: 14px; align-items: center; padding: 0; }
.pac-library-toggle { display: grid; grid-template-columns: 18px 1fr; gap: 14px; align-items: center; background: transparent; border: 0; cursor: pointer; padding: 14px 4px; text-align: left; }
.pac-library-toggle:hover .pac-library-name { color: var(--pac-orange); }
.pac-library-chev { color: var(--pac-mute); font-weight: 700; }
.pac-library-name { font: 500 13.5px var(--font-body); color: var(--pac-ink); transition: color 0.15s; }
.pac-library-add { width: 26px; height: 26px; border-radius: 6px; background: #fff; border: 1px solid var(--pac-line); display: inline-grid; place-items: center; color: var(--pac-mute); margin-left: 4px; margin-right: 4px; cursor: pointer; transition: background 0.15s, border-color 0.15s, color 0.15s; }
.pac-library-add:hover { background: var(--pac-orange); color: #fff; border-color: var(--pac-orange); }
.pac-library-add svg { width: 12px !important; height: 12px !important; }
.pac-library-desc { padding: 0 4px 16px 36px; font: 400 13px/1.5 var(--font-body); color: var(--pac-ink2); }

/* Actions tab */
.pac-act-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pac-act-card { display: flex; flex-direction: column; gap: 8px; }
.pac-act-head { display: grid; grid-template-columns: 30px 1fr 1fr 80px; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--pac-line); font: 600 11px var(--font-body); letter-spacing: 0.04em; color: var(--pac-mute); text-transform: uppercase; }
.pac-act-empty { padding: 32px 16px; text-align: center; font-size: 13px; }
.pac-act-row { display: grid; grid-template-columns: 30px 1fr 1fr 80px; gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--pac-line); }
.pac-act-row:last-child { border-bottom: 0; }
.pac-act-row .pac-act-n { color: var(--pac-mute); font-size: 12px; }
.pac-act-row .pac-act-name { color: var(--pac-orange); font: 600 13px var(--font-body); cursor: pointer; }
.pac-act-row .pac-act-ver { color: var(--pac-mute); font-size: 12px; letter-spacing: 0; }
.pac-act-row .pac-pill { justify-self: start; }
.pac-act-payslips .pac-payslip-tools { display: inline-flex; align-items: center; gap: 12px; }
.pac-act-payslips .pac-payslip-tools { display: inline-flex; align-items: center; gap: 10px; }
.pac-act-payslips .pac-payslip-tools .pac-iconbtn-soft { width: 38px; height: 38px; border-radius: 10px; }
.pac-ps-head { align-items: center; }
.pac-ps-head-l { display: inline-flex; align-items: center; gap: 10px; }
.pac-ps-count { display: inline-grid; place-items: center; min-width: 26px; height: 22px; padding: 0 8px; border-radius: 999px; background: #F0F3F8; color: var(--pac-ink2); font: 700 12px var(--font-body); }
.pac-ps-unlock { display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; border-radius: 10px; background: #fff; border: 1px solid var(--pac-line); color: var(--pac-ink); font: 600 13px var(--font-body); cursor: pointer; transition: border-color .15s, background .15s; }
.pac-ps-unlock:hover { border-color: var(--pac-orange); color: var(--pac-orange); }
.pac-ps-unlock svg { width: 14px !important; height: 14px !important; }
.pac-ps-regen { display: inline-flex; align-items: center; padding: 8px 16px; border-radius: 10px; background: var(--pac-ink); color: #fff; border: 0; font: 600 13px var(--font-body); cursor: pointer; transition: opacity .15s; }
.pac-ps-regen:hover { opacity: .9; }
.pac-ps-regen-chev { margin-left: 6px; display: inline-flex; }
.pac-ps-list { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pac-ps-row { display: grid; grid-template-columns: 40px minmax(0,1fr) auto auto 18px; gap: 14px; align-items: center; padding: 12px 14px; border: 1px solid var(--pac-line); border-radius: 12px; background: #fff; cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .12s; }
.pac-ps-row:hover { border-color: var(--pac-line-strong); box-shadow: var(--shadow-compact, 0 4px 8px 0 rgba(0,23,56,0.08)); transform: translateY(-1px); }
.pac-ps-row .pac-av { width: 40px; height: 40px; font-size: 13px; overflow: hidden; }
.pac-ps-row .pac-av img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.pac-ps-id { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pac-ps-code { font: 700 11px var(--font-mono); letter-spacing: 0; color: var(--pac-orange); }
.pac-ps-name { font: 600 14px var(--font-body); color: var(--pac-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pac-ps-flag { justify-self: end; }
.pac-ps-count-pill { display: inline-flex; align-items: center; gap: 5px; padding: 5px 12px; border-radius: 999px; background: #F0F3F8; color: var(--pac-ink2); font: 500 12.5px var(--font-body); white-space: nowrap; }
.pac-ps-count-pill b { color: var(--pac-ink); font-weight: 700; }
.pac-ps-go { color: var(--pac-line-strong); display: inline-grid; place-items: center; transition: color .15s, transform .15s; }
.pac-ps-row:hover .pac-ps-go { color: var(--pac-orange); transform: translateX(2px); }
.pac-ps-more { display: flex; justify-content: center; padding: 18px 0 4px; }
.pac-ps-more-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 22px; border-radius: 999px; background: #fff; border: 1px solid var(--pac-line); color: var(--pac-ink); font: 600 13px var(--font-body); cursor: pointer; transition: border-color .15s, color .15s, background .15s; }
.pac-ps-more-btn:hover { border-color: var(--pac-orange); color: var(--pac-orange); background: #FFF9F6; }
.pac-ps-more-ic { display: inline-flex; }

/* ── Payslip · Employee detail modal (Salary / Payment / Payslip) ── */
.pac-pemod { display: block; background: #fff; padding-bottom: 24px; position: relative; }
.pac-pemod-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 32px;
  border-bottom: 1px solid var(--pac-line);
  background: #fff;
}
.pac-pemod-crumb { display: flex; align-items: center; gap: 10px; font: 600 14px var(--font-body); color: var(--pac-ink); }
.pac-pemod-crumb > span:first-child { color: var(--pac-mute); font-weight: 500; }
.pac-pemod-sep, .pac-pemod-chev { color: var(--pac-mute); }
.pac-pemod-chev { font-weight: 700; font-size: 11px; margin-left: 4px; }
.pac-pemod-nav { width: 36px !important; height: 36px !important; background: var(--pac-ink) !important; color: #fff !important; border-radius: 10px !important; margin-left: 4px; }
.pac-pemod-nav svg { width: 12px !important; height: 12px !important; }
.pac-pemod-meta { display: flex; align-items: flex-start; gap: 14px; }
.pac-pemod-meta > .pac-pill-yellow { align-self: flex-start; }
.pac-pemod-close { width: 38px !important; height: 38px !important; background: var(--pac-ink) !important; color: #fff !important; border-radius: 10px !important; align-self: flex-start; margin-top: 26px; }
.pac-pemod-close svg { width: 13px !important; height: 13px !important; }
.pac-pemod-meta > .pac-pill-yellow { margin-top: -28px; }
.pac-pemod-meta { flex-direction: column; align-items: flex-end; }
.pac-pemod-meta .pac-pill-yellow { font-size: 11px; padding: 4px 10px; }

.pac-pemod-emp { display: flex; align-items: center; justify-content: space-between; padding: 20px 32px; border-bottom: 1px solid var(--pac-line); }
.pac-pemod-emp-l { display: flex; align-items: center; gap: 14px; }
.pac-av.lg { width: 48px; height: 48px; font-size: 16px; }
.pac-pemod-emp-id .pac-empl-id-id { color: var(--pac-orange); font: 600 13px var(--font-body); }
.pac-pemod-emp-name { font: 700 22px/1.2 var(--font-display); color: var(--pac-ink); margin-top: 2px; display: inline-flex; align-items: center; gap: 10px; letter-spacing: -0.015em; }
.pac-pemod-emp-name .pac-pill { font-size: 11px; padding: 3px 10px; }
.pac-pemod-emp-role { color: var(--pac-mute); font-size: 12.5px; margin-top: 3px; }
.pac-pemod-tabs { display: inline-flex; align-items: center; gap: 0; padding: 4px; background: #F0F3F8; border-radius: 999px; }
.pac-pemod-tabs button { background: transparent; border: 0; padding: 8px 20px; border-radius: 999px; cursor: pointer; font: 600 13px var(--font-body); color: var(--pac-mute); }
.pac-pemod-tabs button.is-on { background: var(--pac-orange); color: #fff; box-shadow: 0 4px 10px -4px rgba(255,95,31,0.55); }
.pac-pemod-tabs button:not(.is-on):hover { color: var(--pac-ink); }

.pac-pemod-body { padding: 32px 32px 24px; }

/* Salary tab */
.pac-sal-head { display: flex; align-items: center; gap: 12px; margin-bottom: 28px; }
.pac-sal-h2 { font: 700 22px/1 var(--font-display); color: var(--pac-ink); margin: 0; letter-spacing: -0.015em; }
.pac-sal-add-wrap { position: relative; }
.pac-sal-add { width: 30px; height: 30px; border-radius: 50%; background: #FFF1EA; color: var(--pac-orange); border: 0; cursor: pointer; display: grid; place-items: center; transition: background 0.15s, transform 0.15s; }
.pac-sal-add.is-open { background: var(--pac-ink); color: #fff; transform: rotate(45deg); }
.pac-sal-add svg { width: 13px !important; height: 13px !important; }
.pac-sal-add-menu { position: absolute; top: calc(100% + 8px); left: 0; background: #fff; border: 1px solid var(--pac-line); border-radius: 10px; box-shadow: 0 16px 32px -10px rgba(0,23,56,0.22); padding: 6px 0; min-width: 180px; z-index: 5; }
.pac-sal-add-menu button { display: block; width: 100%; text-align: left; background: transparent; border: 0; padding: 10px 18px; cursor: pointer; font: 500 14px var(--font-body); color: var(--pac-ink); }
.pac-sal-add-menu button:hover { background: var(--pac-bg); color: var(--pac-orange); }

.pac-sal-cols { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 32px; }
.pac-sal-section-h { font: 700 16px var(--font-display); color: var(--pac-ink); margin: 0 0 18px; letter-spacing: -0.005em; }
.pac-sal-group { display: inline-block; margin: 18px 0 10px; padding: 4px 10px; font-size: 10px; letter-spacing: 0.04em; }
.pac-sal-row {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 130px;
  grid-template-rows: auto auto auto;
  row-gap: 6px; column-gap: 16px;
  padding: 18px 0;
  border-top: 1px solid var(--pac-line);
  cursor: pointer;
  transition: background 0.15s;
}
.pac-sal-row:hover { background: rgba(255,95,31,0.04); }
.pac-sal-dot { position: absolute; left: -14px; top: 22px; width: 8px; height: 8px; border-radius: 50%; background: #FFB343; }
.pac-sal-row-name { font: 600 14px var(--font-body); color: var(--pac-ink); }
.pac-sal-row-amt { text-align: right; font: 600 14px var(--font-mono); color: var(--pac-ink); letter-spacing: 0; font-variant-numeric: tabular-nums; }
.pac-sal-row-prev { font-size: 12.5px; color: var(--pac-mute); }
.pac-sal-cols .mono { letter-spacing: 0 !important; font-variant-numeric: tabular-nums; }
.pac-sal-row-prev-v { text-align: right; font-size: 12.5px; color: var(--pac-mute); }
.pac-sal-row-src { font-size: 12.5px; color: var(--pac-mute); }
.pac-sal-row-src-v { text-align: right; display: inline-flex; justify-content: flex-end; gap: 4px; flex-wrap: wrap; }
.pac-sal-row-src-v .pac-pill { font-size: 10px; padding: 2px 6px; }
.pac-pill-yellowsoft { background: #FFF4D6; color: #7a5300; font: 600 10px var(--font-mono); letter-spacing: 0; }
.pac-sal-edit {
  position: absolute;
  right: 156px;
  top: 50%;
  transform: translateY(-50%);
  display: none;
  align-items: center;
  gap: 8px;
  padding: 6px 10px 6px 6px;
  background: var(--pac-orange);
  color: #fff;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 8px 16px -8px rgba(255,95,31,0.55);
  font: 600 12px var(--font-body);
}
.pac-sal-row:hover .pac-sal-edit { display: inline-flex; }
.pac-sal-edit-ic { width: 22px; height: 22px; display: grid; place-items: center; background: var(--pac-ink); color: #fff; border-radius: 50%; }
.pac-sal-edit-ic svg { width: 10px !important; height: 10px !important; }
.pac-sal-edit-l { padding-right: 6px; }

.pac-sal-summary { background: #F0F3F8; border-radius: 14px; padding: 22px; display: flex; flex-direction: column; gap: 20px; align-self: start; }
.pac-sal-summary-h { font: 700 16px var(--font-display); color: var(--pac-ink); margin: 0; letter-spacing: -0.005em; }
.pac-sal-summary-section { display: flex; flex-direction: column; gap: 8px; }
.pac-sal-summary-h2 { font: 700 14px var(--font-body); color: var(--pac-ink); margin-bottom: 6px; }
.pac-sal-summary-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0; font-size: 13.5px; }
.pac-sal-summary-r { text-align: right; display: flex; flex-direction: column; gap: 1px; }
.pac-sal-summary-r small { font-size: 11px; font-weight: 600; }
.pac-sal-summary-total { padding-top: 12px; border-top: 1px solid var(--pac-line-strong); margin-top: 6px; font-weight: 700; }
.pac-sal-row-amt.neg, .pac-sal-summary-r .mono.neg { color: #D22A2A; }
.pac-sal-summary-empty { padding: 6px 0; font-size: 13px; color: var(--pac-mute); }
.pac-sal-summary-net { border-top-width: 2px; }
.pos { color: #0F8529; }
.neg { color: #D22A2A; }

/* Payment method tab */
.pac-pm-section { margin-bottom: 28px; }
.pac-pm-section-h { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.pac-pm-section-h h3 { font: 700 18px var(--font-display); color: var(--pac-ink); margin: 0; letter-spacing: -0.015em; }
.pac-pm-edit { width: 36px !important; height: 36px !important; background: var(--pac-ink) !important; color: #fff !important; border-radius: 10px !important; }
.pac-pm-edit svg { width: 13px !important; height: 13px !important; }
.pac-pm-grid { display: flex; flex-direction: column; }
.pac-pm-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 24px; padding: 14px 0; border-bottom: 1px solid var(--pac-line); align-items: center; font-size: 13.5px; color: var(--pac-ink); }
.pac-pm-row-h { color: var(--pac-mute); font: 600 11px var(--font-body); letter-spacing: 0.06em; text-transform: uppercase; }
.pac-pm-row > span:first-child { font-weight: 500; }

/* Payslip preview */
.pac-payslip-summary { margin-top: 24px; padding: 16px 20px; background: #F0F3F8; border-radius: 10px; }
.pac-payslip-summary-h { font: 700 14px var(--font-body); margin-bottom: 12px; background: #B8C1D1; color: var(--pac-ink); padding: 8px 12px; border-radius: 6px; text-align: center; }
.pac-payslip-summary-grid { display: flex; flex-direction: column; }
.pac-payslip-summary-row { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 14px; padding: 10px 12px; border-bottom: 1px solid var(--pac-line); font-size: 13px; }
.pac-payslip-summary-row-h { font: 700 11px var(--font-body); letter-spacing: 0.04em; color: var(--pac-ink); border-bottom: 1px solid var(--pac-ink); }

.pac-pemod-foot {
  display: flex; align-items: center; justify-content: flex-end; gap: 12px;
  padding: 24px 32px 8px; margin: 24px -32px 0; border-top: 1px solid var(--pac-line);
  background: #fff;
}
.pac-modal-btn-mute { background: #E3E6EC !important; color: var(--pac-mute) !important; }

/* Nested sub-modal (Edit / New earning) */
.pac-pemod-submodal-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 23, 56, 0.55);
  backdrop-filter: blur(8px) saturate(140%);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  z-index: 70;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 0;
  animation: pacFadeIn 0.22s ease-out both;
}
.pac-pemod-submodal {
  background: #fff;
  border-radius: 18px 18px 0 0;
  width: 100%;
  max-width: 1180px;
  max-height: 80%;
  overflow-y: auto;
  box-shadow: 0 -16px 48px -16px rgba(0,23,56,0.35);
  animation: pacSubmIn 0.32s var(--ease-emphasized);
}
@keyframes pacSubmIn { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
.pac-pemod-submodal-h { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 28px; border-bottom: 1px solid var(--pac-line); }
.pac-pemod-submodal-h h3 { font: 700 18px var(--font-display); color: var(--pac-ink); margin: 0; letter-spacing: -0.015em; }
.pac-pemod-edit-tags { display: inline-flex; gap: 8px; margin-left: auto; }

/* Edit row table */
.pac-pemod-edit-body { padding: 22px 28px 28px; }
.pac-pemod-edit-tbl { width: 100%; border-collapse: collapse; }
.pac-pemod-edit-tbl th { text-align: left; padding: 10px 12px; font: 600 11px var(--font-body); color: var(--pac-mute); letter-spacing: 0.04em; text-transform: uppercase; border-bottom: 1px solid var(--pac-line); vertical-align: top; }
.pac-pemod-edit-tbl th small { display: block; font-size: 10px; color: var(--pac-mute); font-weight: 400; letter-spacing: 0; text-transform: none; margin-top: 3px; }
.pac-pemod-edit-tbl td { padding: 14px 12px; border-bottom: 1px solid var(--pac-line); font-size: 13px; vertical-align: middle; }
.pac-pemod-edit-pending { background: #FFF9F6; }
.pac-pemod-edit-num, .pac-pemod-edit-date { display: inline-flex; align-items: center; gap: 4px; padding: 6px 10px; background: #fff; border: 1px solid var(--pac-line); border-radius: 8px; }
.pac-pemod-edit-num input, .pac-pemod-edit-date input { border: 0; outline: 0; background: transparent; font: 500 13px var(--font-mono); width: 80px; padding: 2px 0; color: var(--pac-ink); }
.pac-pemod-edit-num > span, .pac-pemod-edit-date > span { color: var(--pac-mute); font-size: 11px; }
.pac-pemod-edit-num input[readonly] { color: var(--pac-mute); }
.pac-pemod-edit-arr { color: var(--pac-mute); text-align: center; font-size: 16px; }
.pac-pemod-edit-del { width: 28px; height: 28px; }
.pac-pemod-edit-del svg { width: 12px !important; height: 12px !important; }
.pac-pemod-edit-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 20px 0 8px;
  font-size: 12.5px;
  color: var(--pac-ink);
  justify-content: flex-end;
}
.pac-pemod-edit-notice-ic { width: 18px; height: 18px; display: inline-grid; place-items: center; }
.pac-pemod-edit-notice-ic svg { width: 18px !important; height: 18px !important; }
.pac-pemod-edit-foot { display: flex; align-items: center; justify-content: flex-end; gap: 16px; padding-top: 18px; border-top: 1px solid var(--pac-line); margin-top: 8px; }
.pac-pemod-edit-foot .pac-modal-btn { padding: 10px 28px !important; border-radius: 8px !important; }

/* New earning sub-modal */
.pac-pemod-newearn-body { padding: 22px 28px 28px; }
.pac-pemod-newearn-type { display: flex; align-items: center; gap: 28px; margin-bottom: 18px; }
.pac-pemod-newearn-type > label:first-child { font: 600 13px var(--font-body); color: var(--pac-ink); }
.pac-radio { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.pac-radio input { position: absolute; opacity: 0; pointer-events: none; }
.pac-radio-dot { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--pac-line-strong); position: relative; transition: border-color 0.15s; }
.pac-radio.is-on .pac-radio-dot { border-color: var(--pac-orange); background: var(--pac-orange); }
.pac-radio.is-on .pac-radio-dot::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: #fff; }
.pac-radio span:last-child { font: 500 13px var(--font-body); color: var(--pac-ink); }

.pac-pemod-newearn-row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr) 40px; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--pac-line); align-items: center; }
.pac-pemod-newearn-row-h { font: 600 11px var(--font-body); color: var(--pac-mute); letter-spacing: 0.04em; text-transform: uppercase; }
.pac-pemod-newearn-row-h em { color: var(--pac-orange); font-style: normal; }

.pac-pemod-pe-wrap { position: relative; }
.pac-pemod-pe { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 10px 14px; background: #fff; border: 1px solid var(--pac-line); border-radius: 8px; cursor: pointer; font: 500 13px var(--font-body); color: var(--pac-ink); text-align: left; }
.pac-pemod-pe.is-open { background: #FFF1EA; border-color: var(--pac-orange); }
.pac-pemod-pe-chev { color: var(--pac-mute); font-weight: 700; font-size: 11px; }
.pac-pemod-pe.is-open .pac-pemod-pe-chev { color: var(--pac-orange); }
.pac-pemod-pe-menu { position: absolute; top: calc(100% + 4px); left: 0; right: 0; background: #fff; border: 1px solid var(--pac-line); border-radius: 10px; box-shadow: 0 16px 32px -10px rgba(0,23,56,0.22); z-index: 5; overflow: hidden; }
.pac-pemod-pe-search { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--pac-line); }
.pac-pemod-pe-search span { color: var(--pac-mute); display: inline-grid; place-items: center; }
.pac-pemod-pe-search span svg { width: 14px !important; height: 14px !important; }
.pac-pemod-pe-search input { flex: 1; border: 0; outline: 0; background: transparent !important; color: var(--pac-ink) !important; font: 400 13px var(--font-body); }
.pac-pemod-pe-search input::placeholder { color: var(--pac-mute); }
.pac-pemod-pe-list { max-height: 280px; overflow-y: auto; }
.pac-pemod-pe-list button { display: block; width: 100%; text-align: left; padding: 12px 18px; background: transparent; border: 0; cursor: pointer; font: 500 13px var(--font-body); color: var(--pac-ink); }
.pac-pemod-pe-list button:hover, .pac-pemod-pe-list button.is-on { background: #FFF1EA; color: var(--pac-orange); }
.pac-pemod-pe-foot { display: flex; gap: 18px; padding: 10px 18px; border-top: 1px solid var(--pac-line); font-size: 10px; color: var(--pac-mute); }
.pac-pemod-pe-foot kbd { display: inline-grid; place-items: center; min-width: 16px; height: 16px; padding: 0 4px; background: #fff; border: 1px solid var(--pac-line); border-radius: 4px; font: 600 10px var(--font-mono); color: var(--pac-mute); margin-right: 4px; }

.pac-pemod-newearn-amt { display: flex; align-items: center; gap: 4px; padding: 10px 14px; background: #fff; border: 1px solid var(--pac-line); border-radius: 8px; transition: border-color 0.15s, box-shadow 0.15s; }
.pac-pemod-newearn-amt:focus-within { border-color: var(--pac-orange); box-shadow: 0 0 0 3px rgba(255,95,31,0.14); }
.pac-pemod-newearn-amt input { color: var(--pac-ink) !important; }
.pac-pemod-newearn-amt input::placeholder { color: var(--pac-mute); }
.pac-pemod-newearn-amt.is-disabled { background: var(--pac-bg); opacity: 0.7; }
.pac-pemod-newearn-amt input { flex: 1; border: 0; outline: 0; background: transparent; font: 500 13px var(--font-mono); }
.pac-pemod-newearn-amt > span { color: var(--pac-mute); font-size: 11px; }
.pac-pemod-newearn-unit { font: 500 13px var(--font-body); color: var(--pac-ink); }
.pac-pemod-newearn-del:disabled { color: var(--pac-mute); opacity: 0.4; cursor: not-allowed; }
.pac-pemod-newearn-add { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr) 40px; gap: 16px; padding: 10px 14px; margin-top: 8px; background: #fff; border: 1px dashed var(--pac-orange); border-radius: 8px; cursor: pointer; font: 600 13px var(--font-body); color: var(--pac-orange); text-align: left; align-items: center; transition: background 0.15s; }
.pac-pemod-newearn-add:hover { background: #FFF1EA; }
.pac-pemod-newearn-add .pac-pemod-pe-chev { color: var(--pac-orange); }
/* Payroll Run header pills — softer + matching the real app */
.pac-run-pill { padding: 7px 14px; font: 600 12.5px var(--font-body); border-radius: 8px; gap: 7px; }
.pac-run-pill .pac-pill-ic svg { width: 13px !important; height: 13px !important; }
.pac-run-pill.pac-pill-bluesoft { background: #DCEEFA; color: #0A4660; }
.pac-run-pill.pac-pill-greensoft { background: #DCF1E4; color: #0A4E20; }
.pac-run-pill-n {
  display: inline-grid; place-items: center;
  min-width: 20px; height: 18px;
  padding: 0 6px;
  margin-left: 4px;
  background: #0F8529;
  color: #fff;
  border-radius: 5px;
  font: 700 11px var(--font-mono);
  letter-spacing: 0;
}
.pac-run-lock {
  width: 34px; height: 34px;
  border: 1.5px solid #B8DCC4;
  background: #fff;
  color: #0F8529;
  border-radius: 9px;
  cursor: pointer;
  display: grid; place-items: center;
}
.pac-run-lock svg { width: 14px !important; height: 14px !important; }
.pac-run-lock:hover { background: #DCF1E4; }
.pac-run-close { width: 38px !important; height: 38px !important; background: var(--pac-ink) !important; color: #fff !important; border-radius: 10px !important; }
.pac-run-close svg { width: 13px !important; height: 13px !important; }

@media (max-width: 1100px) {
  .pac-aii-cards { grid-template-columns: 1fr; }
  .pac-rwf-list { grid-template-columns: 1fr; }
  .pac-act-cards { grid-template-columns: 1fr; }
}

/* Pulse on the targeted sidebar item for whichever step is current */
.pac-tour.pac-tour-step-0 .pac-side .pac-nav-item:nth-of-type(2) .pac-nav-l::after,
.pac-tour.pac-tour-step-2 .pac-side .pac-nav-item:nth-of-type(3) .pac-nav-l::after {
  content: "";
  display: inline-block;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--pac-orange);
  margin-left: 6px;
  vertical-align: middle;
  animation: pacNavPulse 1.8s ease-out infinite;
}
@keyframes pacNavPulse {
  0%   { box-shadow: 0 0 0 0 rgba(255,95,31,0.55); }
  80%  { box-shadow: 0 0 0 8px rgba(255,95,31,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,95,31,0); }
}

.pac-shell {
  background: #fff;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  padding: 0;
  --pac-ink: #001738;
  --pac-ink2: #1A3E6D;
  --pac-mute: #8B9AB2;
  --pac-line: #E3E6EC;
  --pac-line-strong: #B8C1D1;
  --pac-orange: #FF5F1F;
  --pac-orange-soft: #FFE6D9;
  --pac-bg: #F5F6F8;
  --pac-card: #fff;
  font-family: var(--font-body);
  color: var(--pac-ink);
  position: relative;
}
.pac-shell-inner {
  display: grid;
  grid-template-columns: 221px minmax(0, 1fr);
  min-height: 760px;
  max-height: 1120px;
  background: var(--pac-bg);
  font-size: 13.5px;
  line-height: 1.45;
  position: relative;
}
.pac-main { overflow-y: auto; max-height: 1120px; padding: 28px 32px; background: var(--pac-bg); }

/* sidebar */
.pac-side {
  background: #fff;
  border-right: 1px solid var(--pac-line);
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 5;
}
/* collapse column shift lives on the shell grid (see collapsed block near EOF) */
.pac-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: var(--pac-ink);
  color: #fff;
  position: relative;
}
.pac-brand-mark {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: #fff;
  color: var(--pac-orange);
  display: grid; place-items: center;
  font: 700 11px/1 var(--font-display);
  letter-spacing: 0.06em;
}
.pac-brand-l { font: 700 14px/1.25 var(--font-display); color: #fff; letter-spacing: -0.005em; }
.pac-brand-collapse {
  position: absolute;
  right: -12px;
  top: 28px;
  width: 22px; height: 22px;
  border-radius: 6px;
  background: var(--pac-ink);
  color: #fff;
  display: grid; place-items: center;
  border: 0;
  cursor: pointer;
  z-index: 40;
}
.pac-brand-collapse svg { width: 12px; height: 12px; }
.pac-entity {
  padding: 14px 16px 12px;
  border-bottom: 1px solid var(--pac-line);
  text-align: center;
}
.pac-entity-orb {
  width: 56px; height: 56px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #DCE2EB, #fff 65%);
  margin: 0 auto 8px;
  border: 1px solid #E3E6EC;
}
.pac-entity-orb.pac-entity-orb-badge {
  background: linear-gradient(135deg, #001738 0%, #0B2450 100%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 8px 18px -8px rgba(0, 23, 56, 0.55);
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  padding: 0;
}
.pac-entity-orb.pac-entity-orb-badge img {
  display: block;
  width: 34px; height: 34px;
  max-width: 60%; max-height: 60%;
  object-fit: contain;
}
.pac-entity-name { font: 700 13px/1.2 var(--font-display); color: var(--pac-ink); }
.pac-entity-tools { display: flex; justify-content: space-around; padding-top: 10px; color: var(--pac-mute); }
.pac-entity-tools > span { width: 28px; height: 28px; display: grid; place-items: center; cursor: pointer; position: relative; }
.pac-entity-tools svg { width: 18px; height: 18px; }
.pac-entity-tools .pac-bell i { position: absolute; top: 2px; right: 2px; width: 8px; height: 8px; border-radius: 50%; background: var(--pac-orange); border: 2px solid #fff; }

.pac-nav { padding: 10px 12px; overflow-y: auto; flex: 1 1 auto; min-height: 0; }
.pac-nav-item, .pac-nav-child {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 12px;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: var(--pac-ink);
  font: 600 13px/1 var(--font-body);
  cursor: pointer;
  text-align: left;
  transition: background 0.15s;
}
.pac-nav-item:hover, .pac-nav-child:hover { background: rgba(255, 95, 31, 0.08); }
.pac-nav-item.is-locked .pac-nav-l { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pac-nav-item.is-locked { color: #B8C1D1; position: relative; gap: 8px; }
.pac-nav-item.is-locked .pac-nav-ic { color: #C9D1DD; }
.pac-nav-item.is-locked:hover { background: rgba(255, 95, 31, 0.06); color: var(--pac-ink); }
.pac-nav-item.is-locked:hover .pac-nav-ic { color: #FF5F1F; }
.pac-nav-explore { flex: none; font: 600 9px/1 var(--font-mono, var(--font-body)); letter-spacing: 0.06em; text-transform: uppercase; color: #C9D1DD; border: 1px solid #EDF0F5; border-radius: 999px; padding: 4px 7px; white-space: nowrap; transition: color 0.15s, border-color 0.15s, background 0.15s; }
.pac-nav-item.is-locked:hover .pac-nav-explore { color: #FF5F1F; border-color: #FFC7AC; background: #FFF9F6; }
.pac-side.is-collapsed .pac-nav-explore { display: none; }
.pac-nav-item.is-active { background: var(--pac-orange-soft); }
.pac-nav-ic { width: 18px; height: 18px; display: grid; place-items: center; color: var(--pac-ink); }
.pac-nav-ic svg { width: 18px; height: 18px; }
.pac-nav-l { flex: 1; }
.pac-nav-chev { display: grid; place-items: center; color: var(--pac-mute); transition: transform 0.2s; }
.pac-nav-chev svg { width: 14px; height: 14px; }
.pac-nav-chev.is-open { transform: rotate(180deg); }
.pac-nav-children { padding-left: 30px; display: flex; flex-direction: column; gap: 2px; margin-top: 2px; }
.pac-nav-child {
  padding: 6px 12px;
  font-weight: 400;
  color: var(--pac-ink2);
  border-radius: 6px;
}
.pac-nav-child.is-on { color: var(--pac-orange); font-weight: 700; }
.pac-nav-sep { height: 1px; background: var(--pac-line); margin: 14px 8px; }

.pac-user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-top: 1px solid var(--pac-line);
  background: #F8FAFD;
}
.pac-side:not(.ess-side) .pac-user { appearance: none; width: 100%; border: 0; border-top: 1px solid var(--pac-line); cursor: pointer; text-align: left; transition: background 0.15s; }
.pac-side:not(.ess-side) .pac-user:hover { background: #F0F3F8; }
.pac-user-av { width: 40px; height: 40px; border-radius: 50%; background: #B8C9E2; color: #001738; display: grid; place-items: center; font: 700 13px var(--font-display); overflow: hidden; position: relative; }
.pac-user-av img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.pac-user-id { font: 700 11px/1 var(--font-mono); color: var(--pac-orange); letter-spacing: 0.04em; }
.pac-user-n { font: 700 14px/1.3 var(--font-body); color: var(--pac-ink); display: block; margin-top: 4px; letter-spacing: -0.005em; }
.pac-side-foot { padding: 8px 16px; font-size: 10px; color: var(--pac-mute); letter-spacing: 0.06em; border-top: 1px solid var(--pac-line); background: #F8FAFD; text-align: center; }

/* page */
.pac-page { display: flex; flex-direction: column; gap: 18px; max-width: 1280px; margin: 0 auto; position: relative; padding-bottom: 140px; min-height: 100%; }
.pac-page-head { display: flex; align-items: center; justify-content: space-between; }
.pac-page-head h1 { font: 700 24px/1.2 var(--font-display); color: var(--pac-ink); margin: 0; letter-spacing: -0.015em; }
.pac-mute { color: var(--pac-mute); }
.pac-page .mono { font-family: var(--font-mono); letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.pac-date-arr { display: inline-block; padding: 0 8px; color: var(--pac-mute); letter-spacing: 0; }

/* cards */
.pac-card {
  background: var(--pac-card);
  border: 1px solid #EFF2F6;
  border-radius: 14px;
  padding: 22px;
  position: relative;
  box-shadow: 0 1px 0 rgba(0,23,56,0.02);
}
.pac-card h3 { font: 700 17px/1.2 var(--font-display); margin: 0; color: var(--pac-ink); letter-spacing: -0.005em; }
.pac-card hr { border: 0; border-top: 1px solid var(--pac-line); margin: 14px 0; }
.pac-card-h2 { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.pac-card-h2 > span:first-child { font: 700 17px/1.2 var(--font-display); color: var(--pac-ink); letter-spacing: -0.005em; }
.pac-link { color: var(--pac-orange); cursor: pointer; font-weight: 600; }
.pac-link:hover { text-decoration: underline; color: #BB3F0F; }

/* toggle */
.pac-toggle { display: inline-flex; align-items: center; gap: 12px; cursor: pointer; font: 600 13px var(--font-body); color: var(--pac-ink); }
.pac-toggle input { display: none; }
.pac-toggle-track { width: 36px; height: 18px; background: var(--pac-line-strong); border-radius: 999px; position: relative; transition: background 0.2s; }
.pac-toggle-track.on { background: var(--pac-orange); }
.pac-toggle-dot { position: absolute; left: 2px; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: transform 0.2s; }
.pac-toggle-track.on .pac-toggle-dot { transform: translateX(18px); }

/* dashboard grid */
.pac-dash-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 18px; max-width: 100%; }
.pac-dash-grid > * { min-width: 0; }
.pac-dash-grid > .pac-chart-card { grid-column: span 2; }
.pac-dash-grid > .pac-chart-card--col { grid-column: span 1; }
.pac-dash-grid > .pac-chart-card--col .pac-bar { width: 26px; }
.pac-dash-grid > .pac-parent-card { display: flex; flex-direction: column; align-items: center; justify-content: center; }
.pac-payroll-row { display: grid; grid-template-columns: 1fr auto auto; gap: 18px; align-items: center; cursor: pointer; padding: 8px 0; }
.pac-ref { color: var(--pac-orange); font-weight: 600; font-size: 11px; letter-spacing: 0.02em; }
.pac-payroll-name { font: 700 14px/1.3 var(--font-body); color: var(--pac-ink); margin-top: 2px; }
.pac-payroll-sub { font: 400 12px/1.4 var(--font-body); color: var(--pac-mute); margin-top: 2px; }
.pac-icon-pill { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; background: var(--pac-ink); color: #fff; border-radius: 6px; font: 600 11px var(--font-body); }
.pac-icon-rk { display: inline-grid; place-items: center; color: var(--pac-orange); }
.pac-icon-rk svg { width: 14px; height: 14px; }
.pac-pill { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 6px; font: 600 11.5px/1 var(--font-body); letter-spacing: 0.01em; }
.pac-pill-blue { background: #1497BA; color: #fff; }
.pac-pill-green { background: #0F8529; color: #fff; }
.pac-pill-red { background: #D22A2A; color: #fff; }
.pac-pill-ink { background: var(--pac-ink); color: #fff; }
.pac-pill-yellow { background: #FFD15A; color: var(--pac-ink); }
.pac-pill-yellow-soft { background: #FFF4D6; color: #7a5300; }
.pac-pill-grey { background: #E3E6EC; color: var(--pac-ink); }
.pac-pill-orange { background: #FFE3D7; color: #BB3F0F; }
.pac-pill-ic { display: inline-grid; place-items: center; }
.pac-pill-ic svg { width: 11px; height: 11px; }
.pac-period-nav { display: inline-flex; align-items: center; gap: 12px; color: var(--pac-ink); font: 700 14px var(--font-display); }
.pac-period-nav.inline { padding: 8px 0; }
.pac-period-nav button { background: transparent; border: 0; cursor: pointer; color: var(--pac-mute); }
.pac-period-nav svg { width: 14px; height: 14px; }
.pac-evt-row { display: grid; grid-template-columns: 60px 1fr auto; gap: 14px; align-items: center; padding: 10px 0; }
.pac-evt-head { font: 600 10px/1 var(--font-body); letter-spacing: 0.08em; color: var(--pac-mute); text-transform: uppercase; padding: 4px 0 8px; border-bottom: 1px solid var(--pac-line); margin-bottom: 4px; }
.pac-date { display: inline-flex; flex-direction: column; align-items: flex-start; }
.pac-date b { font: 700 16px var(--font-display); }
.pac-date i { font-style: normal; font-size: 10px; color: var(--pac-mute); }

.pac-stat-tiles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.pac-stat-tile { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 10px; border: 1px solid var(--pac-line); border-radius: 10px; background: #fff; text-align: center; min-height: 120px; justify-content: center; }
.pac-stat-ic { color: var(--pac-ink); }
.pac-stat-ic svg { width: 32px; height: 32px; }
.pac-stat-l { font: 500 12.5px/1.4 var(--font-body); color: var(--pac-ink2); }
.pac-stat-v { display: inline-block; padding: 5px 12px; background: var(--pac-ink); color: #fff; border-radius: 6px; font: 700 14px var(--font-body); margin-top: 4px; letter-spacing: 0.005em; }

.pac-headcount { display: flex; align-items: center; gap: 18px; justify-content: space-between; }
.pac-hc-legend { flex: 1; min-width: 0; }
.pac-hc-keys { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 7px; max-width: 190px; }
.pac-hc-keys li { display: flex; align-items: center; gap: 8px; font: 500 13px var(--font-body); color: var(--pac-ink2, #3F587F); }
.pac-hc-keys li b { margin-left: auto; font-weight: 700; color: var(--pac-ink); }
.pac-hc-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.pac-hc-dot.is-join { background: var(--pac-orange); }
.pac-hc-dot.is-leave { background: var(--pac-ink); }
.pac-hc-dot.is-none { background: var(--pac-line); }
.pac-hc-donut { position: relative; width: 128px; height: 128px; flex: none; }
.pac-hc-donut svg { width: 100%; height: 100%; display: block; }
.pac-hc-track { fill: none; stroke: var(--pac-line); stroke-width: 9; }
.pac-hc-arc { fill: none; stroke-width: 9; stroke-linecap: round; }
.pac-hc-arc.is-join { stroke: var(--pac-orange); }
.pac-hc-arc.is-leave { stroke: var(--pac-ink); }
.pac-hc-center { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; line-height: 1.05; }
.pac-hc-center b { font: 700 28px var(--font-display); color: var(--pac-ink); }
.pac-hc-center span { font: 500 9px var(--font-body); color: var(--pac-mute); text-transform: uppercase; letter-spacing: 0.07em; }
.pac-headcount-l { font: 700 14px var(--font-body); color: var(--pac-ink); }
.pac-headcount-s { font: 400 12px var(--font-body); color: var(--pac-mute); }
.pac-ring { width: 90px; height: 90px; border-radius: 50%; border: 8px solid var(--pac-line); }
.pac-ring-sm { display: inline-block; width: 32px; height: 32px; border-radius: 50%; border: 4px solid var(--pac-line); margin-left: auto; }
.pac-hc-ring { width: 34px; height: 34px; margin-left: auto; display: inline-block; flex: none; }
.pac-hc-ring svg { width: 100%; height: 100%; display: block; }
.pac-hc-ring .pac-hc-track { stroke-width: 4; }
.pac-hc-ring .pac-hc-arc { stroke-width: 4; stroke-linecap: round; }
.pac-headcount-tot { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--pac-line); font: 600 14px var(--font-body); }

.pac-currency { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; }

/* chart */
.pac-bar-chart { padding: 16px 0 0; }
.pac-bar-plot { display: flex; gap: 8px; height: 220px; }
.pac-bar-ylabels { display: flex; flex-direction: column; justify-content: space-between; width: 34px; flex: none; text-align: right; }
.pac-bar-ylabels span { font: 400 10px/1 var(--font-body); color: var(--pac-mute); white-space: nowrap; transform: translateY(-4px); }
.pac-bar-area { position: relative; flex: 1; min-width: 0; }
.pac-bar-axis { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; pointer-events: none; }
.pac-bar-grid { border-bottom: 1px dashed rgba(184, 193, 209, 0.4); height: 0; }
.pac-bars { position: relative; z-index: 1; height: 100%; display: flex; gap: 12px; align-items: flex-end; padding: 0 20px; }
.pac-bar-col { flex: 1; display: flex; align-items: flex-end; justify-content: center; height: 100%; }
.pac-bar { width: 40px; background: var(--pac-ink); border-radius: 2px 2px 0 0; transition: height 0.6s var(--ease-emphasized); animation: pacBarIn 0.7s var(--ease-emphasized) both; }
@keyframes pacBarIn { from { transform: scaleY(0); transform-origin: bottom; } to { transform: scaleY(1); } }
.pac-bar-months { display: flex; gap: 12px; padding: 10px 20px 0 62px; }
.pac-bar-months span { flex: 1; text-align: center; font: 400 11px/1.2 var(--font-body); color: var(--pac-ink); }
.pac-bar-m { font: 400 11px var(--font-body); color: var(--pac-ink); }

/* global */
.pac-tabs-row { grid-column: span 2; display: flex; gap: 24px; padding: 0 2px; }
.pac-tab { color: var(--pac-mute); font-weight: 600; cursor: pointer; padding: 8px 0; border-bottom: 2px solid transparent; }
.pac-tab.is-on { color: var(--pac-orange); border-bottom-color: var(--pac-orange); }
.pac-entity-row { display: grid; grid-template-columns: 32px 1fr 40px auto; align-items: center; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--pac-line); }
.pac-entity-row:last-child { border-bottom: 0; }
.pac-entity-flag { font-size: 20px; }
.pac-entity-row-n { font-weight: 600; color: var(--pac-orange); }
.pac-parent-card .pac-parent-orb { width: 80px; height: 80px; border-radius: 50%; background: #001738; margin: 16px auto; border: 1px solid var(--pac-line); overflow: hidden; }
.pac-parent-card .pac-parent-orb img { width: 100%; height: 100%; display: block; border-radius: 50%; }
.pac-parent-n { font: 700 14px var(--font-display); text-align: center; color: var(--pac-ink); }
.pac-currency-pill { padding: 6px 16px; background: var(--pac-ink); color: #fff; border-radius: 6px; font: 700 13px var(--font-mono); margin: 16px auto 0; display: inline-block; }
.pac-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 40px 16px; }
.pac-empty p { color: var(--pac-ink); font-weight: 600; }
.pac-empty-sm { padding: 24px; text-align: center; color: var(--pac-mute); }
.pac-hc-row { display: grid; grid-template-columns: 26px 1fr 78px 78px; column-gap: 8px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--pac-line); }
.pac-hc-row:last-child { border-bottom: 0; }
.pac-hc-row .pac-pill { justify-self: start; }
.pac-hc-row .pac-ring-sm { justify-self: start; margin-left: 0; }
.pac-hc-head { grid-template-columns: 26px 1fr 78px 78px !important; column-gap: 8px !important; padding: 18px 0 10px !important; }
.pac-hc-head span:nth-child(3), .pac-hc-head span:nth-child(4) { text-align: left; white-space: normal; line-height: 1.3; align-self: end; min-width: 0; }
.pac-hc-n { font-weight: 600; color: var(--pac-orange); }

/* tabs (dark/orange) */
.pac-tabs-dark { background: var(--pac-ink); border-radius: 12px; display: flex; gap: 0; padding: 6px; align-items: center; }
.pac-tab-dark { background: transparent; border: 0; color: rgba(255,255,255,0.6); padding: 12px 22px; font: 700 13px var(--font-body); cursor: pointer; border-radius: 8px; }
.pac-tab-dark.is-on { background: var(--pac-orange); color: #fff; }

/* employees */
.pac-empl-card { padding: 0; overflow: hidden; }
.pac-empl-card .pac-card-h2 { padding: 18px 24px 14px; }
.pac-icon-btns { display: flex; gap: 6px; }
.pac-icon-btns button, .pac-iconbtn { width: 28px; height: 28px; border-radius: 6px; background: var(--pac-ink); color: #fff; border: 0; display: grid; place-items: center; cursor: pointer; }
.pac-icon-btns button svg, .pac-iconbtn svg { width: 13px; height: 13px; }
.pac-empl-table { width: 100%; }
.pac-empl-thead { display: grid !important; grid-template-columns: 48px 64px 48px minmax(360px, 2.6fr) minmax(220px, 1.3fr) 180px 56px !important; align-items: center; column-gap: 32px !important; padding: 14px 24px; font: 600 11px var(--font-body); letter-spacing: 0.05em; text-transform: uppercase; color: var(--pac-mute); border-bottom: 1px solid var(--pac-line); }
.pac-empl-row { display: grid !important; grid-template-columns: 48px 64px 48px minmax(360px, 2.6fr) minmax(220px, 1.3fr) 180px 56px !important; align-items: center; column-gap: 32px !important; min-height: 72px; padding: 14px 24px; border-bottom: 1px solid var(--pac-line); cursor: pointer; transition: background 0.15s; font-size: 13.5px; }
.pac-empl-row:hover { background: #F8FAFD; }
.pac-empl-lock { display: grid; place-items: center; }
.pac-empl-lock-bg { width: 32px; height: 32px; border-radius: 8px; background: #DCE9DE; color: #0F8529; display: grid; place-items: center; }
.pac-empl-lock-bg svg { width: 15px; height: 15px; }
.pac-empl-n { color: var(--pac-mute); }
.pac-empl-id { display: flex !important; align-items: center; gap: 12px; min-width: 0; flex-wrap: nowrap !important; overflow: hidden; }
.pac-empl-id-text { display: flex !important; flex-direction: column; min-width: 0; gap: 2px; flex: 1 1 auto; overflow: hidden; }
.pac-empl-id-text .pac-empl-id-id { white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; }
.pac-empl-id-text .pac-empl-id-name { white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; color: var(--pac-ink); font-weight: 500; line-height: 1.35; }
.pac-empl-id-text > .pac-pill { align-self: flex-start; margin-top: 4px; white-space: nowrap; }
.pac-av { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font: 700 11px var(--font-body); color: #fff; flex: none; position: relative; }
.pac-av > img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; display: block; }
.pac-av:has(img) { overflow: visible; background: transparent; }
.pac-av.lg { width: 56px; height: 56px; font-size: 18px; }
.pac-av-lock { position: absolute; bottom: -2px; right: -2px; width: 18px; height: 18px; border-radius: 50%; background: #0F8529; border: 2px solid #fff; }
.pac-av.tone-teal   { background: #2BB395; }
.pac-av.tone-ink    { background: #8B9AB2; color: #fff; }
.pac-av.tone-green  { background: #2BB395; }
.pac-av.tone-coral  { background: #ED7B6B; }
.pac-av.tone-blue   { background: #4F86C5; }
.pac-av.tone-purple { background: #7B6BD9; }
.pac-av.tone-sky    { background: #6EC9E3; color: #0E2447; }
.pac-av.tone-yellow { background: #E6C260; color: #0E2447; }
/* Native table — clean column behavior under transforms / zoom */
.pac-empl-tbl { width: 100%; table-layout: fixed; border-collapse: collapse; }
.pac-empl-tbl thead th {
  text-align: left;
  font: 600 11px var(--font-body);
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--pac-mute);
  padding: 14px 16px 14px 0;
  border-bottom: 1px solid var(--pac-line);
  vertical-align: middle;
}
.pac-empl-tbl thead th:first-child { padding-left: 24px; }
.pac-empl-tbl thead th:last-child { padding-right: 24px; text-align: center; }
.pac-empl-tbl tbody tr {
  cursor: pointer;
  transition: background 0.15s;
  border-bottom: 1px solid var(--pac-line);
}
.pac-empl-tbl tbody tr:last-child { border-bottom: 0; }
.pac-empl-tbl tbody tr:hover { background: var(--pac-bg); }
.pac-empl-tbl tbody td {
  padding: 14px 16px 14px 0;
  border: 0;
  vertical-align: middle;
  font-size: 13.5px;
  color: var(--pac-ink);
}
.pac-empl-tbl tbody td:first-child { padding-left: 24px; }
.pac-empl-tbl tbody td:last-child { padding-right: 24px; text-align: center; color: var(--pac-mute); }
.pac-empl-tbl .pac-empl-n { color: var(--pac-mute); padding-left: 0; padding-right: 0; }
.pac-empl-tbl .pac-empl-emp-cell { padding-left: 16px; line-height: 1.4; }
.pac-empl-emp-wrap { display: flex; align-items: center; gap: 12px; }
.pac-empl-emp-wrap .pac-empl-id-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; line-height: 1.4; }
.pac-empl-emp-wrap .pac-empl-id-id { color: var(--pac-orange); font: 600 12.5px/1.3 var(--font-body); letter-spacing: 0.01em; }
.pac-empl-emp-wrap .pac-empl-id-name { color: var(--pac-ink); font: 500 14px/1.35 var(--font-body); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pac-empl-emp-wrap .pac-pill { margin-top: 4px; align-self: flex-start; }
.pac-empl-tbl .pac-empl-pos { color: var(--pac-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-left: 0; font-weight: 700 !important; }
.pac-empl-tbl .pac-empl-hire { color: var(--pac-fg-secondary); white-space: nowrap; }
.pac-empl-tbl .pac-empl-sort { text-align: center; color: var(--pac-mute); cursor: pointer; }
.pac-empl-tbl .pac-empl-lock { padding: 14px 24px 14px 24px; }

/* Payrolls table — native table shape (Open payroll period) */
.pac-pr-tbl .pac-pr-id { color: var(--pac-orange); font-weight: 600; white-space: nowrap; padding-left: 24px; }
.pac-pr-tbl .pac-pr-name-cell { padding-left: 0; }
.pac-pr-tbl .pac-pr-name-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pac-pr-tbl .pac-pr-name { font-weight: 600; color: var(--pac-ink); white-space: nowrap; }
.pac-pr-tbl .pac-pr-sub { color: var(--pac-mute); font-size: 12px; margin-top: 4px; white-space: nowrap; }
.pac-pr-tbl .pac-pr-paydate { color: var(--pac-ink); white-space: nowrap; }
.pac-pr-tbl .pac-pr-select { color: var(--pac-orange); font-weight: 600; cursor: pointer; text-align: right; padding-right: 24px; white-space: nowrap; }
.pac-pr-tbl tbody td .pac-pill { display: inline-flex; }

/* Gross-to-Net (Payroll run) table — native */
.pac-g2n-tbl .pac-g2n-n { color: var(--pac-mute); padding-left: 24px; white-space: nowrap; }
.pac-g2n-tbl .pac-g2n-emp-cell { padding-left: 0; }
.pac-g2n-tbl .pac-g2n-num { vertical-align: middle; white-space: nowrap; }
.pac-g2n-tbl .pac-g2n-num small { display: block; margin-top: 2px; }
.pac-g2n-tbl .pac-g2n-ai { white-space: normal; }
.pac-g2n-tbl .pac-g2n-actions { padding-right: 24px; text-align: right; }
.pac-g2n-tbl .pac-g2n-actions .pac-row-end { display: inline-flex; align-items: center; gap: 8px; position: relative; justify-content: flex-end; }
.pac-g2n-tbl tbody tr.is-highlight { background: #FFF6F1; }

/* Universal responsive overflow for every prototype table */
.pac-empl-card { padding: 0; overflow: hidden; overflow-x: auto; }
.pac-empl-card .pac-empl-tbl { min-width: 720px; }
.pac-empl-card .pac-g2n-tbl { min-width: 1080px; }

/* Additional column styling for converted tables (leaves / balances / templates / docs / closed) */
.pac-leave-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--pac-orange); margin-right: 6px; vertical-align: middle; }
.pac-bal-tbl .pac-bal-th { vertical-align: top; }
.pac-bal-tbl .pac-bal-th-b { font: 600 11px/1.2 var(--font-body); color: var(--pac-mute); letter-spacing: 0.04em; text-transform: uppercase; }
.pac-bal-tbl .pac-bal-th-s { font: 400 10px/1.2 var(--font-body); color: var(--pac-mute); margin-top: 4px; }
.pac-bal-tbl .pac-bal-num { text-align: center; }
.pac-tpl-tbl .pac-tpl-name { color: var(--pac-orange); font-weight: 600; }
.pac-tpl-tbl .pac-tpl-actions { white-space: nowrap; text-align: right; vertical-align: middle; }
.pac-tpl-tbl .pac-tpl-actions .pac-link { display: inline-block; margin-right: 10px; vertical-align: middle; }
.pac-tpl-tbl .pac-tpl-actions .pac-tbl-more { display: inline-grid !important; vertical-align: middle; }
.pac-tpl-tbl .pac-tpl-actions svg { display: inline-block; vertical-align: middle; width: 16px; height: 16px; }
.pac-doc-tbl .pac-doc-name { color: var(--pac-orange); font-weight: 600; }
.pac-doc-tbl .pac-doc-date { font-size: 12px; }
.pac-doctpl-tbl .pac-doctpl-name { color: var(--pac-orange); font-weight: 600; }
.pac-closed-tbl .pac-closed-period { color: var(--pac-orange); font-weight: 600; cursor: pointer; }
.pac-leaves-tbl { min-width: 1020px; }
.pac-leaves-tbl .pac-empl-emp-cell { min-width: 230px; }
.pac-leaves-scroll { overflow-x: auto; margin: 0 -4px; }
.pac-leaves-tbl td, .pac-leaves-tbl th { padding-right: 18px; }
.pac-leaves-tbl .pac-av img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.pac-leaves-tbl .pac-leaves-type, .pac-leaves-tbl .pac-leaves-dates { white-space: nowrap; }
.pac-leaves-tbl .pac-leaves-status { white-space: nowrap; }
.pac-leaves-tbl .pac-leaves-status .pac-pill { margin-right: 6px; }
.pac-bal-tbl { min-width: 1120px; }
.pac-bal-tbl .pac-bal-th-b { white-space: normal; }
.pac-bal-scroll { overflow-x: auto; }
.pac-bal-tbl .pac-av img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; }
.pac-doc-tbl { min-width: 900px; }
.pac-tpl-tbl { min-width: 760px; }
.pac-doctpl-tbl { min-width: 700px; }
.pac-closed-tbl { min-width: 0; }
/* Any pac-card holding a prototype table gets horizontal scroll if needed */
.pac-card:has(.pac-empl-tbl) { overflow-x: auto; }
/* Card-header icon button cluster: always inline flex even when not wrapped in .pac-icon-btns */
.pac-card-h2 > div:last-child { display: inline-flex; align-items: center; gap: 6px; flex: none; }

/* Global reports table — same native table shape as employees */
.pac-greports-tbl .pac-greports-n { color: var(--pac-mute); padding-left: 24px; }
.pac-greports-tbl .pac-greports-name-cell { padding-left: 0; }
.pac-greports-tbl .pac-greports-name {
  color: var(--pac-orange);
  font: 600 14px/1.4 var(--font-body);
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-bottom: 6px;
}
.pac-greports-tbl .pac-greports-name-cell .pac-pill { align-self: flex-start; }
.pac-greports-tbl .pac-greports-date { color: var(--pac-ink); font: 600 13.5px/1.3 var(--font-body); }
.pac-greports-tbl .pac-greports-user { color: var(--pac-mute); font: 400 12px/1.4 var(--font-body); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pac-greports-tbl .pac-greports-type { color: var(--pac-ink); font-weight: 600; white-space: nowrap; }
.pac-greports-tbl .pac-greports-vis { white-space: nowrap; }
.pac-greports-tbl .pac-greports-vis .pac-pill { display: inline-flex; }
.pac-reports-search { height: 34px; padding: 0 14px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.25); background: rgba(255,255,255,0.10); color: #fff; font: 400 13px var(--font-body); outline: none; width: 220px; }
.pac-reports-search::placeholder { color: rgba(255,255,255,0.55); }
.pac-reports-empty { text-align: center; color: var(--pac-mute); padding: 32px 0 !important; }
.pac-empl-id-id { font: 700 12px/1.3 var(--font-mono); color: var(--pac-orange); letter-spacing: 0.04em; }
.pac-empl-id-name { font: 500 13.5px/1.4 var(--font-body); color: var(--pac-ink); }
.pac-empl-row > span:last-child { color: var(--pac-mute); display: grid; place-items: center; }
.pac-empl-row > span:last-child svg { width: 16px; height: 16px; }
.pac-empl-sort { display: grid; place-items: center; color: var(--pac-ink); }

/* FAB */
.pac-fab-wrap {
  position: fixed;
  bottom: 28px;
  right: 28px;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
  z-index: 9999;
}
.pac-fab { width: 56px; height: 56px; border-radius: 50%; background: var(--pac-orange); color: #fff; border: 0; display: grid; place-items: center; cursor: pointer; box-shadow: 0 12px 20px -10px rgba(255,95,31,0.5); transition: transform 0.2s; }
.pac-fab:hover { transform: rotate(45deg); }
.pac-fab.is-open { background: #BB3F0F; }
.pac-fab.is-open:hover { transform: rotate(0); }
.pac-fab svg { width: 24px; height: 24px; }
.pac-fab-sm { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--pac-orange); color: #fff; }
.pac-fab-sm svg { width: 14px; height: 14px; }
.pac-fab-menu { display: flex; flex-direction: column; gap: 0; background: #fff; border: 1px solid var(--pac-line); border-radius: 10px; box-shadow: 0 14px 28px -10px rgba(0,23,56,0.18); overflow: hidden; }
.pac-fab-menu button { background: transparent; border: 0; padding: 14px 22px; text-align: right; font: 700 14px var(--font-body); color: var(--pac-ink); cursor: pointer; }
.pac-fab-menu button:hover { background: #F8FAFD; color: var(--pac-orange); }

/* employee detail */
.pac-detail-head { display: flex; align-items: center; gap: 16px; }
.pac-crumb { font: 600 14px var(--font-body); color: var(--pac-ink); display: inline-flex; align-items: center; gap: 8px; flex: 1; }
.pac-crumb svg { width: 14px; height: 14px; color: var(--pac-mute); }
.pac-emp-h { display: grid; grid-template-columns: 1.2fr 1fr; gap: 32px; padding: 24px 0; align-items: center; border-bottom: 1px solid var(--pac-line); }
.pac-emp-h-l { display: flex; gap: 18px; align-items: center; }
.pac-emp-h-name { font: 700 20px/1.2 var(--font-display); color: var(--pac-ink); margin-top: 2px; }
.pac-emp-h-r { display: flex; flex-direction: column; gap: 8px; }
.pac-emp-meta { display: flex; align-items: center; gap: 12px; font-size: 12px; padding-left: 16px; border-left: 1px solid var(--pac-line); }
.pac-edit-pen { color: var(--pac-mute); cursor: pointer; }
.pac-edit-pen svg { width: 12px; height: 12px; }
.pac-login { font-size: 13px; color: var(--pac-ink); }
.pac-emp-tabs { background: var(--pac-ink); border-radius: 12px; display: flex; padding: 4px; gap: 0; flex-wrap: wrap; }
.pac-emp-tab { background: transparent; border: 0; color: rgba(255,255,255,0.6); padding: 10px 16px; font: 600 12.5px var(--font-body); cursor: pointer; border-radius: 8px; }
.pac-emp-tab.is-on { background: var(--pac-orange); color: #fff; }
.pac-emp-body h3 { margin-bottom: 18px; }
.pac-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 32px; }
.pac-field { display: grid; grid-template-columns: 200px 1fr; gap: 16px; padding: 6px 0; }
.pac-field-k { font: 600 13.5px var(--font-body); color: var(--pac-orange); }
.pac-field-v { font: 500 13.5px var(--font-body); color: var(--pac-ink); }
.pac-emp-table { border-radius: 8px; border: 1px solid var(--pac-line); overflow: hidden; }
.pac-emp-tr { display: grid; grid-template-columns: 2.2fr 0.7fr 1fr 1fr 60px; gap: 12px; padding: 10px 14px; align-items: center; border-bottom: 1px solid var(--pac-line); font-size: 12.5px; }
.pac-emp-tr:last-child { border-bottom: 0; }

/* payroll head */
.pac-payroll-head h1 span { font-size: 14px; }
.pac-run-head { display: flex; justify-content: space-between; align-items: center; }
.pac-run-meta { display: flex; align-items: center; gap: 10px; }
.pac-iconbtn-lock { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 8px; background: #DCE9DE; color: #0F8529; }
.pac-row-actions { display: flex; align-items: center; gap: 18px; }
.pac-collapse-h { font: 600 13px var(--font-body); color: var(--pac-ink); padding: 12px 0; }
.pac-pr-thead { grid-template-columns: 140px 140px 1fr 100px 110px 80px; }
.pac-pr-row { grid-template-columns: 140px 140px 1fr 100px 110px 80px; padding: 16px 24px; align-items: flex-start; }

.pac-period-close { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.pac-pc-l { display: flex; align-items: center; gap: 14px; }
.pac-pc-ic { width: 40px; height: 40px; border-radius: 50%; background: #F0F3F8; display: grid; place-items: center; color: var(--pac-mute); }
.pac-pc-ic svg { width: 22px; height: 22px; }
.pac-pc-h { font: 700 14px var(--font-body); }
.pac-pc-r { display: flex; align-items: center; gap: 12px; }
.pac-btn-mute, .pac-btn-primary { background: #E3E6EC; color: var(--pac-mute); border: 0; padding: 10px 24px; border-radius: 8px; font: 700 13px var(--font-body); cursor: pointer; }
.pac-btn-primary { background: var(--pac-orange); color: #fff; }
.pac-btn-mute:not(:disabled):hover { background: var(--pac-orange); color: #fff; }

/* closed/doctpl/greports: legacy grid rules removed — these tables now render as native <table> via .pac-empl-tbl */

/* payroll run insights */
.pac-payroll-notice { display: flex; gap: 14px; padding: 16px 20px; background: #F8FAFD; border-radius: 12px; border: 1px solid var(--pac-line); align-items: flex-start; }
.pac-payroll-notice-ic { width: 32px; height: 32px; border-radius: 50%; background: #E3E6EC; color: var(--pac-ink); display: grid; place-items: center; flex: none; }
.pac-payroll-notice-ic svg { width: 16px; height: 16px; }
.pac-payroll-notice b { display: block; margin-bottom: 4px; }
.pac-payroll-notice p { color: var(--pac-mute); font-size: 12px; margin: 0; }
.pac-insights-card { padding: 22px 24px; overflow-x: auto; }
/* Always a single horizontal strip; scrolls sideways on narrow cards. */
.pac-insights-h { display: flex; flex-direction: row; align-items: stretch; gap: 22px; flex-wrap: nowrap; min-width: max-content; }
.pac-insights-brand { display: flex; align-items: center; gap: 14px; flex: none; align-self: center; }
.pac-insights-ic { width: 40px; height: 40px; border-radius: 12px; background: linear-gradient(135deg, #FFE3D7, #FFC4A1); color: #BB3F0F; display: grid; place-items: center; flex: none; }
.pac-insights-ic svg { width: 20px; height: 20px; stroke-width: 2.6; }
.pac-insights-title { font: 700 18px var(--font-display); color: var(--pac-ink); letter-spacing: -0.01em; white-space: nowrap; }
.pac-insights-div { display: block; width: 1px; align-self: stretch; background: var(--pac-line); flex: none; }
.pac-events-sum { display: flex; flex-direction: column; gap: 12px; flex: none; }
.pac-events-l { font: 600 10.5px/1.4 var(--font-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--pac-mute); white-space: nowrap; }
.pac-events-sum-top { display: flex; align-items: center; gap: 16px; }
.pac-ring-sm { display: inline-block; width: 36px; height: 36px; border-radius: 50%; border: 4px solid var(--pac-orange); flex: none; margin-left: 0; }
.pac-events-progress { font: 700 24px/1 var(--font-display); color: var(--pac-ink); }
.pac-events-rows { display: grid; grid-template-columns: auto auto; gap: 4px 20px; font: 500 12px/1.3 var(--font-body); color: var(--pac-ink2); }
.pac-events-rows span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.pac-events-rows b { color: var(--pac-ink); font-weight: 700; }
.pac-ev-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--pac-line-strong); flex: none; }
.pac-ev-emp { color: var(--pac-mute); }
.pac-events-stats { display: flex; flex-direction: row; gap: 28px; flex: none; }
.pac-events-block { display: flex; flex-direction: column; gap: 8px; flex: none; }
.pac-events-block-v { display: flex; align-items: baseline; gap: 6px; font: 700 20px/1.1 var(--font-display); color: var(--pac-ink); letter-spacing: -0.01em; white-space: nowrap; }
.pac-events-block-v small { font-size: 11px; color: var(--pac-mute); font-weight: 500; }

/* g2n */
.pac-g2n { padding: 0; overflow: hidden; }
.pac-g2n-scroll { overflow-x: auto; }
.pac-g2n-scroll .pac-g2n-tbl { min-width: 1080px; }
.pac-g2n .pac-card-h2 { padding: 18px 24px; }
.pac-tabs-pill { display: inline-flex; background: #F0F3F8; border-radius: 999px; padding: 4px; }
.pac-tabs-pill button { background: transparent; border: 0; padding: 6px 16px; font: 600 12px var(--font-body); cursor: pointer; color: var(--pac-ink); border-radius: 999px; }
.pac-tabs-pill button.is-on { background: var(--pac-orange); color: #fff; }
.pac-ai-finding { display: flex; align-items: center; gap: 12px; padding: 12px 20px; margin: 0 24px 16px; border: 1px solid #F0CFA1; background: linear-gradient(180deg, #FFF4D6, #fff); border-radius: 12px; font-size: 12.5px; }
.pac-ai-finding svg { width: 18px; height: 18px; }
.pac-filters { display: flex; align-items: center; gap: 6px; margin-left: 16px; flex: 1; }
.pac-filter-pill { background: #fff; border: 1px solid var(--pac-line-strong); padding: 4px 10px; border-radius: 6px; cursor: pointer; font: 600 11px var(--font-body); color: var(--pac-ink); }
.pac-filter-pill.is-on { background: var(--pac-ink); color: #fff; border-color: var(--pac-ink); }
.pac-filter-pill { display: inline-flex; align-items: center; gap: 0; }
.pac-filter-pill .pac-filter-count {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 16px;
  padding: 0 5px;
  border-radius: 999px;
  background: rgba(0, 23, 56, 0.08);
  color: var(--pac-mute);
  font: 700 10px/1 var(--font-mono);
  margin-left: 7px;
  letter-spacing: 0;
}
.pac-filter-pill.is-on .pac-filter-count { background: rgba(255, 255, 255, 0.22); color: #fff; }
.pac-g2n-empty { text-align: center; padding: 40px !important; color: var(--pac-mute); }

/* Payroll Open · Interface files tab */
.pac-if-card { padding: 0; }
.pac-if-card > .pac-card-h2 { padding: 20px 24px 16px; }
.pac-if-card .pac-if-h { padding-bottom: 0; }
.pac-if-subtabs { display: inline-flex; align-items: center; gap: 18px; }
.pac-if-subtab {
  background: transparent;
  border: 0;
  font: 600 13px/1 var(--font-body);
  color: var(--pac-mute);
  cursor: pointer;
  padding: 6px 2px;
  position: relative;
  letter-spacing: -0.005em;
}
.pac-if-subtab:hover { color: var(--pac-ink); }
.pac-if-subtab.is-on { color: var(--pac-orange); }
.pac-if-subtab.is-on::after {
  content: "";
  position: absolute;
  left: 0; right: 0;
  bottom: -8px;
  height: 2px;
  background: var(--pac-orange);
  border-radius: 2px;
}
.pac-if-subtab em { font-style: normal; color: var(--pac-mute); margin-left: 4px; font-size: 12px; font-weight: 500; }
.pac-if-subtab.is-on em { color: var(--pac-orange); opacity: 0.7; }

.pac-if-tbl-head {
  display: grid;
  grid-template-columns: 1fr auto;
  padding: 16px 24px 12px;
  margin-top: 8px;
  border-top: 1px solid var(--pac-line);
  font: 600 12px/1 var(--font-body);
  color: var(--pac-ink);
  letter-spacing: -0.005em;
}
.pac-if-tbl-head span:nth-child(2) { color: var(--pac-ink); }
.pac-if-empty {
  margin: 0 24px 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 18px;
  background: var(--pac-bg);
  border: 1px solid var(--pac-line);
  border-radius: 10px;
  color: var(--pac-ink2);
  font: 500 13px/1 var(--font-body);
}
.pac-if-empty-ic {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--pac-ink);
  color: #fff;
  display: grid; place-items: center;
  flex: none;
}
.pac-if-empty-ic svg { width: 12px !important; height: 12px !important; }
.pac-if-foot { padding: 0 24px 22px; display: flex; justify-content: flex-end; }

/* Interface files rows (persisted / rejected) */
.pac-if-list { list-style: none; margin: 0; padding: 0 0 16px; }
.pac-if-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 14px;
  padding: 14px 24px;
  border-top: 1px solid var(--pac-line);
  font: 400 13.5px/1.3 var(--font-body);
}
.pac-if-row:first-child { border-top: 0; }
.pac-if-row:hover { background: var(--pac-bg); }
.pac-if-fname { color: var(--pac-ink); letter-spacing: 0; }
.pac-if-date { color: var(--pac-ink); font-size: 12.5px; min-width: 170px; text-align: right; letter-spacing: 0; }
.pac-if-pull { background: var(--pac-orange); border: 0; color: #fff; padding: 10px 22px; border-radius: 999px; font: 700 13px var(--font-body); cursor: pointer; transition: background 0.15s, transform 0.15s; }
.pac-if-pull:hover { background: #BB3F0F; transform: translateY(-1px); }

.pac-if-upload {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 0;
  color: var(--pac-ink);
  font: 600 13px var(--font-body);
  cursor: pointer;
}
.pac-if-upload:hover { color: var(--pac-orange); }
.pac-if-upload-ic {
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--pac-orange);
  color: #fff;
  display: grid; place-items: center;
}
.pac-if-upload-ic svg { width: 11px !important; height: 11px !important; }

/* Persisted imports row */
.pac-persist-row {
  display: grid;
  grid-template-columns: 48px 80px 1fr auto;
  align-items: center;
  gap: 16px;
  margin: 0 24px;
  padding: 16px 18px;
  background: #fff;
  border: 1px solid var(--pac-line);
  border-radius: 12px;
}
.pac-persist-n {
  width: 36px; height: 36px;
  border-radius: 8px;
  background: var(--pac-ink);
  color: #fff;
  display: grid; place-items: center;
  font: 700 14px/1 var(--font-mono);
  letter-spacing: 0;
}
.pac-persist-label { font: 600 13px var(--font-body); color: var(--pac-ink); }
.pac-persist-by { display: flex; align-items: center; gap: 10px; min-width: 0; }
.pac-persist-by .pac-av { width: 32px; height: 32px; font-size: 12px; }
.pac-persist-by .pac-empl-id-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.pac-persist-when { font-size: 11px; color: var(--pac-mute); letter-spacing: 0; margin-left: 12px; white-space: nowrap; }
.pac-persist-events { display: inline-flex; align-items: center; gap: 8px; }
.pac-persist-events-l { font: 600 12px var(--font-body); color: var(--pac-mute); }
.pac-persist-events-n {
  display: inline-grid; place-items: center;
  min-width: 22px; height: 22px;
  padding: 0 7px;
  border-radius: 6px;
  background: var(--pac-ink);
  color: #fff;
  font: 700 11px/1 var(--font-mono);
}

.pac-persist-files-head { border-top: 0; padding-top: 18px; }
.pac-persist-foot { padding: 4px 24px 22px; text-align: center; }
.pac-persist-more { display: flex; flex-direction: column; gap: 10px; padding: 14px 0 0; animation: pacPersistIn 0.3s var(--ease-emphasized); }
@keyframes pacPersistIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.pac-persist-row.pac-persist-row-collapsed { padding: 12px 18px; }
.pac-persist-row.pac-persist-row-collapsed .pac-persist-n { width: 32px; height: 32px; font-size: 13px; }

/* Inbound parsers table */
.pac-if-card:has(.pac-parser-scroll) { overflow: hidden; overflow-x: clip; }
.pac-parser-scroll { overflow-x: auto; }
.pac-empl-card .pac-parser-tbl,
.pac-parser-tbl { min-width: 1280px; }
.pac-parser-tbl .pac-parser-id { color: var(--pac-orange); font-weight: 600; padding-left: 24px; }
.pac-parser-tbl .pac-parser-actor { display: flex; flex-direction: column; gap: 1px; }
.pac-parser-tbl .pac-parser-actor-n { color: var(--pac-ink); font-weight: 500; }
.pac-parser-tbl .pac-parser-actor-id { color: var(--pac-mute); font-size: 11px; }
.pac-parser-tbl .pac-parser-fname { color: var(--pac-ink); }
.pac-parser-tbl .pac-parser-err { color: #D22A2A; display: inline-flex; align-items: center; gap: 6px; }
.pac-parser-tbl .pac-parser-err-ic {
  width: 16px; height: 16px;
  border-radius: 50%;
  background: #D22A2A;
  color: #fff;
  display: inline-grid; place-items: center;
  flex: none;
}
.pac-parser-tbl .pac-parser-err-ic svg { width: 9px !important; height: 9px !important; }
.pac-parser-tbl tbody td:last-child { padding-right: 16px; }
.pac-parser-tbl .pac-iconbtn-soft { width: 28px; height: 28px; background: transparent !important; border: 0 !important; color: var(--pac-mute) !important; display: grid; place-items: center; }
.pac-parser-tbl .pac-iconbtn-soft:hover { background: transparent !important; border: 0 !important; color: var(--pac-orange) !important; }
.pac-parser-tbl .pac-iconbtn-soft svg { width: 16px !important; height: 16px !important; }
/* Report row kebab menu — matches ESS table more-button */
.pac-tbl-more { background: transparent !important; border: 0 !important; color: var(--pac-mute) !important; cursor: pointer; display: grid; place-items: center; width: 28px; height: 28px; padding: 0; }
.pac-tbl-more:hover { background: transparent !important; border: 0 !important; color: var(--pac-orange) !important; }
.pac-tbl-more svg { width: 16px !important; height: 16px !important; }
.pac-rowmenu-wrap { position: relative; display: inline-flex; }
.pac-rowmenu { position: absolute; top: calc(100% + 4px); right: 0; z-index: 30; min-width: 178px; background: #fff; border: 1px solid var(--pac-line); border-radius: 12px; box-shadow: 0 12px 28px -8px rgba(0,23,56,0.22); padding: 6px; display: flex; flex-direction: column; gap: 2px; }
.pac-rowmenu button { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; background: transparent; border: 0; border-radius: 8px; padding: 9px 10px; font: 500 13px var(--font-body); color: var(--pac-ink); cursor: pointer; }
.pac-rowmenu button:hover { background: var(--pac-bg); color: var(--pac-orange); }
.pac-rowmenu button svg { width: 15px; height: 15px; flex: none; }
.pac-empl-card:has(.pac-greports-tbl) { overflow: visible; }
.pac-g2n-thead, .pac-g2n-row { grid-template-columns: 36px 1fr 130px 130px 130px 130px 150px 80px; padding: 12px 24px; }
.pac-g2n-row { align-items: flex-start; position: relative; }
.pac-g2n-row.is-highlight { background: #FFF6F1; }
.pac-flag-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #FF9F79; margin-right: 6px; }
.pac-flag-dot.ok { background: transparent; }
.pac-g2n-row small.neg { color: #D22A2A; font-size: 10.5px; }
.pac-g2n-row small.pos { color: #0F8529; font-size: 10.5px; }
.pac-ai-ok { width: 24px; height: 24px; border-radius: 50%; background: #DCE9DE; color: #0F8529; display: grid; place-items: center; }
.pac-ai-ok svg { width: 12px; height: 12px; }
.pac-ai-fixed { display: inline-flex; align-items: center; gap: 8px; animation: pacAiFixIn 360ms cubic-bezier(.2,.8,.2,1) both; }
.pac-ai-fixed .pac-ai-ok { flex: none; animation: pacAiFixPop 420ms cubic-bezier(.34,1.56,.64,1) both; }
.pac-ai-clean { display: inline-flex; align-items: center; gap: 8px; }
.pac-ai-clean .pac-ai-ok { flex: none; }
.pac-ai-clean-t { font: 500 13px/1.2 var(--font-body); color: #3F587F; white-space: nowrap; }
.pac-ai-fixed-t { font: 600 13px/1.2 var(--font-body); color: #0F8529; white-space: nowrap; }
@keyframes pacAiFixIn { from { opacity: 0; transform: translateX(-6px); } to { opacity: 1; transform: none; } }
@keyframes pacAiFixPop { 0% { transform: scale(.4); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .pac-ai-fixed, .pac-ai-fixed .pac-ai-ok { animation: none; } }
.pac-row-end { display: flex; align-items: center; gap: 6px; position: relative; }
.pac-row-end svg { width: 16px; height: 16px; }
.pac-row-menu { position: absolute; right: 0; top: 28px; background: #fff; border: 1px solid var(--pac-line); border-radius: 10px; box-shadow: 0 14px 28px -10px rgba(0,23,56,0.18); padding: 6px; z-index: 5; display: flex; flex-direction: column; min-width: 160px; }
.pac-row-menu button { background: transparent; border: 0; padding: 10px 14px; text-align: left; font: 600 13px var(--font-body); cursor: pointer; border-radius: 6px; color: var(--pac-ink); white-space: nowrap; }
.pac-row-menu button:hover { background: #F8FAFD; color: var(--pac-orange); }
.pac-row-menu-fixed { position: fixed; right: auto; top: auto; min-width: 168px; display: flex; flex-direction: column; z-index: 200; }
.pac-run-footer { padding: 16px 24px; border-top: 1px solid var(--pac-line); display: flex; align-items: center; justify-content: space-between; margin-top: 12px; }

/* leaves listing/balances */
.pac-leaves-thead, .pac-leaves-row { grid-template-columns: 36px 1.4fr 1.2fr 1.5fr 1fr 1fr 40px; }
.pac-leave-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #FFB343; margin-right: 6px; }
/* legacy grid-table rules for Balances removed — table now uses native <table> */

/* calendar — senior pass */
.pac-cal-head { align-items: flex-start; }
.pac-cal-head-l .pac-page-sub { margin: 4px 0 0; font-size: 13px; color: var(--pac-mute); }
.pac-cal-tools { display: flex; align-items: center; gap: 10px; }
.pac-cal-today { background: #fff; border: 1px solid var(--pac-line); color: var(--pac-ink); padding: 7px 14px; border-radius: 8px; font: 600 13px var(--font-body); cursor: pointer; transition: border-color 0.15s, color 0.15s; }
.pac-cal-today:hover { border-color: var(--pac-orange); color: var(--pac-orange); }
.pac-cal-nav { display: flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid var(--pac-line); border-radius: 10px; background: #fff; }
.pac-cal-nav .pac-iconbtn-soft { width: 28px !important; height: 28px !important; border: 0 !important; background: transparent !important; }
.pac-cal-nav .pac-iconbtn-soft:hover { background: var(--pac-bg) !important; color: var(--pac-orange) !important; }
.pac-cal-month-l { font: 700 14px/1 var(--font-display); color: var(--pac-ink); letter-spacing: -0.01em; padding: 0 10px; min-width: 140px; text-align: center; }
.pac-cal-year { color: var(--pac-mute); font-weight: 500; }

.pac-cal-card { padding: 0; }
.pac-cal-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  border-bottom: 1px solid var(--pac-line);
}
.pac-cal-legend { display: flex; gap: 22px; font: 500 12.5px var(--font-body); color: var(--pac-ink2); align-items: center; }
.pac-cal-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 7px; vertical-align: middle; }
.pac-cal-leg-payroll { background: #1497BA; }
.pac-cal-leg-holiday { background: var(--pac-orange); }
.pac-cal-legend em { font-style: normal; color: var(--pac-mute); margin-left: 6px; font-size: 11px; background: var(--pac-bg); padding: 2px 7px; border-radius: 999px; }
.pac-cal-add { display: inline-flex; align-items: center; gap: 8px; box-shadow: 0 8px 16px -8px rgba(255,95,31,0.5); transition: background 0.15s; }
.pac-cal-add:hover { background: var(--hrb-orange-70, #C13A00); }
.pac-cal-add .pac-doc-action-ic, .pac-cal-add svg { color: #fff; }

.pac-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  background: var(--pac-line);
  gap: 1px;
  border-bottom: 1px solid var(--pac-line);
}
.pac-cal-th {
  background: #F8FAFC;
  color: var(--pac-mute);
  padding: 10px 12px;
  font: 600 11px/1 var(--font-body);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.pac-cal-cell {
  background: #fff;
  min-height: 96px;
  padding: 8px 10px 10px;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  text-align: left;
  border: 0;
  cursor: pointer;
  transition: background 0.12s, box-shadow 0.12s;
  font: inherit;
}
.pac-cal-cell:hover { background: #FBFCFE; }
.pac-cal-cell.is-mute { background: #FAFBFD; }
.pac-cal-cell.is-mute .pac-cal-d { color: var(--pac-mute); }
.pac-cal-cell.is-weekend { background: #FBFBFD; }
.pac-cal-cell.is-weekend.is-mute { background: #F7F8FB; }
.pac-cal-cell.is-selected { box-shadow: inset 0 0 0 2px var(--pac-orange); z-index: 1; }
.pac-cal-cell.is-today { background: rgba(255, 95, 31, 0.05); }

.pac-cal-d {
  display: inline-grid;
  place-items: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  color: var(--pac-ink);
  font: 600 11.5px/1 var(--font-body);
  align-self: flex-start;
  background: transparent;
}
.pac-cal-d.is-today-d {
  background: var(--pac-orange);
  color: #fff;
  font-weight: 700;
}

.pac-cal-events { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pac-cal-chip {
  font: 500 10.5px/1.3 var(--font-body);
  padding: 3px 7px;
  border-radius: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: 0;
}
.pac-cal-chip.is-payroll { background: #E6F2FB; color: #0F6F8F; border-left: 3px solid #1497BA; }
.pac-cal-chip.is-holiday { background: #FFF1EA; color: #A53F0F; border-left: 3px solid var(--pac-orange); }
.pac-cal-more { font: 600 10px/1 var(--font-body); color: var(--pac-mute); padding-left: 7px; margin-top: 1px; }

/* detail strip below grid */
.pac-cal-detail {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 24px;
  padding: 18px 20px;
  background: #F8FAFC;
  border-top: 1px solid var(--pac-line);
  align-items: center;
}
.pac-cal-detail.is-empty { background: #fff; }
.pac-cal-detail-date {
  display: flex;
  align-items: center;
  gap: 14px;
}
.pac-cal-detail-day {
  font: 700 36px/1 var(--font-display);
  color: var(--pac-ink);
  letter-spacing: -0.03em;
}
.pac-cal-detail-mo { font: 700 14px/1.2 var(--font-display); color: var(--pac-ink); letter-spacing: -0.005em; }
.pac-cal-detail-wd { font-size: 11px; color: var(--pac-mute); letter-spacing: 0.06em; text-transform: uppercase; margin-top: 3px; }
.pac-cal-detail-list { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.pac-cal-detail-row {
  display: grid;
  grid-template-columns: 14px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  background: #fff;
  border: 1px solid var(--pac-line);
  border-radius: 8px;
}
.pac-cal-detail-dot { width: 8px; height: 8px; border-radius: 50%; }
.pac-cal-detail-row.is-payroll .pac-cal-detail-dot { background: #1497BA; }
.pac-cal-detail-row.is-holiday .pac-cal-detail-dot { background: var(--pac-orange); }
.pac-cal-detail-l { font: 500 13px/1.3 var(--font-body); color: var(--pac-ink); }
.pac-cal-detail-empty { font: 500 13px/1.4 var(--font-body); color: var(--pac-mute); padding: 6px 0; }

/* legacy grid-table rules removed (now native <table>); display:table-cell guarantees no orphan flex/grid clobbers our tables */
.pac-empl-tbl, .pac-empl-tbl thead, .pac-empl-tbl tbody, .pac-empl-tbl tr, .pac-empl-tbl th, .pac-empl-tbl td { box-sizing: border-box; }
.pac-empl-tbl thead { display: table-header-group !important; }
.pac-empl-tbl tbody { display: table-row-group !important; }
.pac-empl-tbl tr { display: table-row !important; }
.pac-empl-tbl th, .pac-empl-tbl td { display: table-cell !important; }
.pac-folders { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 16px; }
.pac-folder { padding: 16px; border: 1px solid var(--pac-line); border-radius: 12px; display: flex; flex-direction: column; gap: 4px; cursor: pointer; transition: border-color 0.15s; }
.pac-folder:hover { border-color: var(--pac-orange); }
.pac-folder-ic { width: 32px; height: 32px; border-radius: 8px; background: #F0F3F8; color: var(--pac-orange); display: grid; place-items: center; margin-bottom: 8px; }
.pac-folder-ic svg { width: 18px; height: 18px; }
.pac-folder b { font: 700 14px var(--font-display); }
.pac-doctpl-thead, .pac-doctpl-row { padding: 14px 24px; }

/* Document templates · senior pass */
.pac-tpl-page-head { align-items: flex-start; }
.pac-tpl-page-head .pac-page-sub { margin: 4px 0 0; color: var(--pac-mute); font-size: 13px; }
.pac-tpl-new { display: inline-flex; align-items: center; gap: 8px; }
.pac-tpl-new .pac-doc-action-ic { width: 14px; height: 14px; }
.pac-tpl-newfolder { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.pac-tpl-newfolder .pac-doc-action-ic { width: 12px; height: 12px; }
.pac-tpl-newfolder .pac-doc-action-ic svg { width: 11px !important; height: 11px !important; }

/* folder grid */
.pac-tpl-folders {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
  margin-top: 16px;
}
.pac-tpl-folder {
  display: grid;
  grid-template-columns: 36px 1fr;
  grid-template-rows: auto auto;
  column-gap: 12px;
  row-gap: 2px;
  align-items: center;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid var(--pac-line);
  border-radius: 12px;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.15s, transform 0.15s, box-shadow 0.15s;
}
.pac-tpl-folder:hover { border-color: var(--pac-orange); transform: translateY(-2px); box-shadow: 0 8px 20px -14px rgba(0,23,56,0.18); }
.pac-tpl-folder-ic {
  grid-row: 1 / span 2;
  width: 36px; height: 36px;
  border-radius: 9px;
  display: grid; place-items: center;
  background: #F0F3F8;
  color: var(--pac-ink2);
}
.pac-tpl-folder-ic svg { width: 17px !important; height: 17px !important; }
.pac-tpl-folder.tone-orange .pac-tpl-folder-ic { background: #FFF1EA; color: var(--pac-orange); }
.pac-tpl-folder.tone-blue   .pac-tpl-folder-ic { background: #E6F2FB; color: #1480B4; }
.pac-tpl-folder.tone-green  .pac-tpl-folder-ic { background: #E8F6EC; color: #0F8529; }
.pac-tpl-folder.tone-ink    .pac-tpl-folder-ic { background: #ECEFF4; color: var(--pac-ink); }
.pac-tpl-folder-name { font: 700 14px/1.2 var(--font-display); color: var(--pac-ink); letter-spacing: -0.005em; }
.pac-tpl-folder-count { font-size: 11.5px; color: var(--pac-mute); }

/* tools row */
.pac-tpl-count { font: 600 11px/1 var(--font-mono); color: var(--pac-mute); background: var(--pac-bg); padding: 4px 8px; border-radius: 999px; margin-left: 8px; letter-spacing: 0; }
.pac-tpl-tools { display: flex; align-items: center; gap: 10px; }
.pac-input-search {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border: 1px solid var(--pac-line);
  border-radius: 8px;
  background: #fff;
  min-width: 240px;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.pac-input-search:focus-within { border-color: var(--pac-orange); box-shadow: 0 0 0 3px rgba(255,95,31,0.12); }
.pac-input-search-ic { display: inline-grid; place-items: center; color: var(--pac-mute); }
.pac-input-search-ic svg { width: 13px !important; height: 13px !important; }
.pac-input-search input { border: 0; outline: 0; background: transparent; font: 400 13px/1 var(--font-body); color: var(--pac-ink); flex: 1; min-width: 0; }
.pac-input-search input::placeholder { color: var(--pac-mute); }
.pac-iconbtn-soft { background: #fff !important; border: 1px solid var(--pac-line) !important; color: var(--pac-ink2) !important; width: 34px; height: 34px; }
.pac-iconbtn-soft svg { width: 14px !important; height: 14px !important; }
.pac-iconbtn-soft:hover { border-color: var(--pac-orange) !important; color: var(--pac-orange) !important; }

/* templates table */
.pac-doctpl-tbl .pac-doctpl-name-cell { display: flex !important; align-items: center; gap: 12px; padding-left: 24px; }
.pac-doctpl-tbl .pac-doctpl-ic {
  width: 30px; height: 30px;
  border-radius: 7px;
  background: #FFF1EA;
  color: var(--pac-orange);
  display: inline-grid; place-items: center;
  flex: none;
}
.pac-doctpl-tbl .pac-doctpl-ic svg { width: 14px !important; height: 14px !important; }
.pac-doctpl-tbl .pac-doctpl-name { color: var(--pac-ink); font: 600 14px/1.3 var(--font-body); }
.pac-doctpl-tbl .pac-tpl-date { color: var(--pac-mute); font-weight: 400; font-size: 11.5px; letter-spacing: 0; }
.pac-doctpl-tbl .pac-doctpl-actions { text-align: right; padding-right: 24px; }
.pac-tpl-empty { text-align: center; padding: 40px !important; color: var(--pac-mute); }
.pac-ai-pill { border: 0; cursor: pointer; font: inherit; transition: filter .15s; }
.pac-ai-pill:hover { filter: brightness(0.95); }
.pac-g2n-exp > td { background: #FBFCFE !important; padding: 0 !important; border-bottom: 1px solid var(--pac-line); text-align: left !important; }
.pac-g2n-exp-in { padding: 18px 24px 20px 88px; }
.pac-g2n-exp-h { display: inline-flex; align-items: center; gap: 8px; font: 700 12px var(--font-body); letter-spacing: 0.04em; text-transform: uppercase; color: var(--pac-mute); margin-bottom: 14px; }
.pac-g2n-exp-spark { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: #EFEAFE; color: #7A5AF8; }
.pac-g2n-exp-spark svg { width: 13px !important; height: 13px !important; }
.pac-g2n-exp-cnt { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--pac-ink); color: #fff; font: 700 11px var(--font-body); letter-spacing: 0; }
.pac-g2n-exp-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pac-g2n-card { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; background: #fff; border: 1px solid var(--pac-line); border-radius: 12px; padding: 16px; transition: box-shadow .15s, border-color .15s; }
.pac-g2n-card:hover { border-color: #E3E8F0; box-shadow: 0 6px 16px -10px rgba(0,23,56,0.18); }
.pac-g2n-card-txt { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pac-g2n-card-txt b { font: 600 14px/1.35 var(--font-body); color: var(--pac-ink); }
.pac-g2n-card-txt span { font: 400 13px/1.5 var(--font-body); color: var(--pac-mute); }
.pac-g2n-sev { flex: none; font: 700 10px var(--font-body); letter-spacing: 0.05em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; margin-top: 1px; }
.pac-g2n-sev.is-high { background: #FCE3E0; color: #C0271C; }
.pac-g2n-sev.is-med { background: #FDEFD3; color: #9A6800; }

/* ── Global reports table ─── */
.pac-greports-h { padding: 18px 24px !important; align-items: center; }
.pac-greports-title { font: 700 22px var(--font-display); color: var(--pac-ink); display: inline-flex; align-items: center; gap: 16px; margin: 0; }
.pac-greports-thead, .pac-greports-row { padding: 14px 24px; align-items: center; }
.pac-greports-row { cursor: pointer; }

/* ── Report detail · spreadsheet ─── */
.pac-report-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 8px; border-bottom: 1px solid var(--pac-line); }
.pac-report-meta { display: flex; align-items: center; gap: 28px; }
.pac-report-by, .pac-report-acc { display: flex; flex-direction: column; gap: 4px; }
.pac-spread-card { padding: 0; overflow: hidden; }
.pac-spread-h { display: flex; align-items: center; justify-content: space-between; padding: 18px 22px 10px; }
.pac-spread-h h3 { font: 700 18px var(--font-display); margin: 0; }
.pac-spread-del { background: #DCE9DE; color: var(--pac-ink); }
.pac-spread-toolbar { display: flex; align-items: center; gap: 0; padding: 8px 14px; background: #ECEFF3; border-top: 1px solid var(--pac-line); border-bottom: 1px solid var(--pac-line); }
.pac-spread-tool { padding: 6px 16px; font: 600 12.5px var(--font-body); color: var(--pac-ink); border-radius: 4px; cursor: default; }
.pac-spread-sep { width: 1px; height: 16px; background: var(--pac-line-strong); margin: 0 4px; }
.pac-spread-wrap { overflow: auto; max-height: 520px; background: #fff; }
.pac-spread { width: 100%; border-collapse: collapse; font: 400 12.5px var(--font-body); color: var(--pac-ink); }
.pac-spread th, .pac-spread td {
  border: 1px solid #D7DCE3;
  padding: 8px 12px;
  background: #fff;
  text-align: left;
  vertical-align: middle;
  min-width: 120px;
  height: 30px;
}
.pac-spread thead th { background: #ECEFF3; font: 600 12px var(--font-mono); color: var(--pac-mute); text-align: center; min-width: 110px; }
.pac-spread-corner { width: 38px; min-width: 38px !important; background: #ECEFF3 !important; position: sticky; left: 0; z-index: 2; }
.pac-spread-colh { text-align: center; background: #ECEFF3; }
.pac-spread-rowh { background: #ECEFF3; color: var(--pac-mute); font: 600 11px var(--font-mono); width: 38px; min-width: 38px !important; text-align: center; position: sticky; left: 0; z-index: 1; }
.pac-spread td { cursor: cell; transition: background 0.1s; }
.pac-spread td:hover { background: #F8FAFD; }
.pac-spread td.is-active { background: #fff; box-shadow: inset 0 0 0 2px #1A73E8; position: relative; }
.pac-spread-headrow td { font-weight: 600; }
.pac-spread-tabbar { border-top: 1px solid var(--pac-line); padding: 4px 14px; background: #F8FAFD; display: flex; align-items: center; }
.pac-spread-tab { padding: 8px 18px; background: #fff; border-radius: 6px 6px 0 0; border: 1px solid var(--pac-line); border-bottom: 0; font: 600 12.5px var(--font-body); }
/* Document preview · senior pass */
.pac-doc-prev-head {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 16px;
}
.pac-doc-prev-edit, .pac-doc-prev-close {
  width: 36px !important; height: 36px !important;
  background: var(--pac-ink); color: #fff !important;
  border-radius: 10px !important;
  display: grid; place-items: center;
}
.pac-doc-prev-edit svg, .pac-doc-prev-close svg { width: 14px !important; height: 14px !important; }
.pac-doc-prev-title { min-width: 0; }
.pac-doc-prev-crumb { color: var(--pac-mute); font-size: 11px; letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: 4px; }
.pac-doc-prev-head h1 { font: 700 22px/1.2 var(--font-display) !important; color: var(--pac-ink); margin: 0; letter-spacing: -0.015em; }
.pac-doc-prev-meta { display: flex; align-items: center; gap: 12px; }
.pac-doc-prev-date { color: var(--pac-mute); font-size: 12px; }

/* body grid */
.pac-doc-body { display: grid; grid-template-columns: 1fr 340px; gap: 20px; align-items: start; }
@media (max-width: 980px) { .pac-doc-body { grid-template-columns: 1fr; } }

/* paper */
.pac-doc-paper {
  background: #fff;
  border: 1px solid var(--pac-line);
  border-radius: 14px;
  padding: 40px 48px 48px;
  position: relative;
  box-shadow: 0 1px 0 rgba(0,23,56,0.02), 0 12px 24px -22px rgba(0,23,56,0.18);
}
.pac-doc-paper-tag {
  display: inline-block;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pac-mute);
  background: var(--pac-bg);
  padding: 5px 10px;
  border-radius: 4px;
  margin-bottom: 24px;
}
.pac-doc-paper-h {
  font: 700 24px/1.25 var(--font-display);
  color: var(--pac-ink);
  margin: 0 0 18px;
  letter-spacing: -0.015em;
}
.pac-doc-paper-lead { margin: 0 0 12px; color: var(--pac-ink); }
.pac-doc-paper p { line-height: 1.65; color: var(--pac-ink2); margin: 0 0 14px; }
.pac-doc-paper p b { color: var(--pac-ink); }

.pac-doc-paper-dl {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px 32px;
  margin: 20px 0 24px;
  padding: 18px 20px;
  border: 1px solid var(--pac-line);
  border-radius: 10px;
  background: var(--pac-bg);
}
.pac-doc-paper-dl > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pac-doc-paper-dl dt {
  font: 600 10px/1 var(--font-body);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--pac-mute);
  margin: 0;
}
.pac-doc-paper-dl dd { margin: 0; font: 500 14px/1.4 var(--font-body); color: var(--pac-ink); }
.pac-doc-paper-dl dd .pac-pill { padding: 3px 9px; font-size: 11px; }

.pac-doc-paper-sig { margin-top: 28px; color: var(--pac-ink); }
.pac-doc-paper-foot { margin-top: 56px; max-width: 240px; }
.pac-doc-paper-foot-line { height: 1px; background: var(--pac-ink); margin-bottom: 8px; }
.pac-doc-paper-foot-name { font: 600 14px/1.3 var(--font-display); color: var(--pac-ink); }
.pac-doc-paper-foot-role { font-size: 11px; color: var(--pac-mute); margin-top: 2px; letter-spacing: 0.02em; }

/* aside */
.pac-doc-aside { display: flex; flex-direction: column; gap: 16px; position: sticky; top: 20px; }
.pac-doc-card {
  background: #fff;
  border: 1px solid var(--pac-line);
  border-radius: 12px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.pac-doc-card-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.pac-doc-card-h > span:first-child {
  font: 700 13px/1 var(--font-display);
  color: var(--pac-ink);
  letter-spacing: -0.005em;
}

/* workflow steps */
.pac-wf-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; position: relative; }
.pac-wf-list::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 24px;
  bottom: 24px;
  width: 2px;
  background: var(--pac-line);
  z-index: 0;
}
.pac-wf-step { display: grid; grid-template-columns: 24px 1fr; gap: 12px; position: relative; }
.pac-wf-num {
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--pac-ink);
  color: #fff;
  display: grid; place-items: center;
  font: 700 12px var(--font-body);
  flex: none;
  position: relative;
  z-index: 1;
}
.pac-wf-step.is-done .pac-wf-num { background: #0F8529; }
.pac-wf-body { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.pac-wf-row-h { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.pac-wf-l { font: 600 11px/1 var(--font-body); letter-spacing: 0.08em; text-transform: uppercase; color: var(--pac-mute); }
.pac-wf-row-h .pac-pill { padding: 3px 9px; font-size: 11px; }
.pac-wf-person { display: flex; align-items: center; gap: 10px; padding: 8px; background: var(--pac-bg); border-radius: 8px; }
.pac-wf-person .pac-av { width: 28px; height: 28px; font-size: 11px; }
.pac-wf-when { font-size: 10.5px; color: #0F8529; letter-spacing: 0; }
.pac-wf-step:not(.is-done) .pac-wf-when { color: var(--pac-mute); }

/* actions */
.pac-doc-actions { display: flex; flex-direction: column; gap: 8px; }
.pac-doc-action {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--pac-line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  font: 600 13px/1 var(--font-body);
  color: var(--pac-ink);
  text-align: left;
  transition: border-color 0.15s, background 0.15s, transform 0.15s;
}
.pac-doc-action:hover { border-color: var(--pac-orange); background: #FFF6F1; transform: translateY(-1px); }
.pac-doc-action.is-primary { background: var(--pac-orange); border-color: var(--pac-orange); color: #fff; }
.pac-doc-action.is-primary:hover { background: #BB3F0F; border-color: #BB3F0F; }
.pac-doc-action-ic { display: inline-grid; place-items: center; width: 16px; height: 16px; flex: none; }
.pac-doc-action-ic svg { width: 14px !important; height: 14px !important; }

/* payslip preview */
.pac-payslip-head { display: flex; align-items: center; gap: 16px; }

/* Payslip document — mirrors the ESS payslip (ess-pdf) with PAC data */
.pac-psx-card { padding: 0; background: transparent; border: 0; }
.pac-psx-prev { background: #E3E6EC; border-radius: 10px; padding: 20px; overflow: auto; }
.pac-psx { transform-origin: top center; }
.pac-psx-page { width: 720px; max-width: 100%; margin: 0 auto; background: #fff; box-shadow: var(--shadow-default, 0 12px 18px 0 rgba(0,23,56,0.10)); padding: 34px 38px; display: grid; gap: 16px; }
.pac-psx-brand { margin: 0; font: 700 20px var(--font-display); color: var(--pac-ink); letter-spacing: -0.01em; }
.pac-psx-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; border-top: 2px solid var(--pac-ink); padding-top: 14px; }
.pac-psx-two { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; border-top: 1px solid var(--pac-line); padding-top: 14px; }
.pac-psx-kv { display: grid; gap: 7px; }
.pac-psx-kv > div { display: grid; grid-template-columns: 130px 1fr; gap: 10px; }
.pac-psx-kv span { font: 600 10px var(--font-body); letter-spacing: 0.06em; text-transform: uppercase; color: var(--pac-mute); }
.pac-psx-kv b { font: 500 11.5px var(--font-body); color: var(--pac-ink); }
.pac-psx-net { border: 1px solid var(--pac-ink); border-radius: 8px; padding: 12px 16px; display: grid; gap: 4px; text-align: right; min-width: 190px; }
.pac-psx-net span { font: 600 10px var(--font-body); letter-spacing: 0.06em; text-transform: uppercase; color: var(--pac-mute); }
.pac-psx-net b { font: 700 17px var(--font-display); color: var(--pac-ink); }
.pac-psx-h { margin: 6px 0 0; font: 700 11px var(--font-body); letter-spacing: 0.1em; text-transform: uppercase; color: var(--pac-orange); }
.pac-psx-tbl { width: 100%; border-collapse: collapse; }
.pac-psx-tbl th { text-align: left; padding: 7px 8px; font: 700 9.5px var(--font-body); letter-spacing: 0.06em; text-transform: uppercase; color: #fff; background: var(--pac-ink); }
.pac-psx-tbl td { padding: 7px 8px; font: 400 11.5px var(--font-body); color: var(--pac-ink); border-bottom: 1px solid var(--pac-line); }
.pac-psx-tbl .pac-psx-sum td { background: #F0F3F8; font-weight: 700; }
.pac-psx-note { margin: 4px 0 0; padding-top: 12px; border-top: 1px dashed var(--pac-line); font: 400 10px/1.5 var(--font-body); color: var(--pac-mute); letter-spacing: 0.01em; }
@media (max-width: 720px) { .pac-psx-page { padding: 22px 20px; } .pac-psx-two { grid-template-columns: 1fr; } .pac-psx-top { flex-direction: column; } .pac-psx-net { text-align: left; } }

/* Larger MacBook 14" viewports — more breathing room */
@media (min-width: 1400px) {
  .pac-shell-inner { min-height: 880px; max-height: 1320px; }
  .pac-main { max-height: 1320px; padding: 32px 40px; }
}/* responsive */
@media (max-width: 980px) {
  .pac-shell-inner { grid-template-columns: 72px 1fr; }
  .pac-shell-inner .pac-nav-l, .pac-shell-inner .pac-nav-chev, .pac-shell-inner .pac-brand-l, .pac-shell-inner .pac-entity-name { display: none; }
  .pac-dash-grid { grid-template-columns: 1fr; }
  .pac-dash-grid > .pac-prev, .pac-dash-grid > .pac-chart-card { grid-column: 1; }
  .pac-stat-tiles { grid-template-columns: repeat(2, 1fr); }
  .pac-insights-h { grid-template-columns: 1fr 1fr; gap: 16px; }
  .pac-emp-h { grid-template-columns: 1fr; gap: 12px; }
}


/* ── Payroll embed mode (Step inside the console tour) ──────
   When the section is in embed mode, only the Payroll nav group
   is interactive — every other group/top-level item is dimmed.
   Driven by the .pyr-embedded class on the .console-wrap. */
.pyr-embedded { position: relative; }
.pyr-embedded .pac-side .pac-nav .pac-nav-group {
  opacity: 0.45;
  pointer-events: none;
  transition: opacity 0.25s ease;
}
.pyr-embedded .pac-side .pac-nav .pac-nav-group:has(.pac-nav-item.is-active) {
  opacity: 1;
  pointer-events: auto;
}
.pyr-embedded .pac-side .pac-nav > .pac-nav-item {
  opacity: 0.45;
  pointer-events: none;
}

/* Spotlight cut-out · paints a dark scrim around the target. */
.pyr-tour-spot {
  position: absolute;
  z-index: 19;
  border-radius: 14px;
  pointer-events: none;
  box-shadow:
    0 0 0 9999px rgba(0, 23, 56, 0.55),
    0 0 0 3px var(--accent),
    0 0 0 6px rgba(255, 95, 31, 0.18);
  transition: all 0.4s var(--ease-emphasized);
}

.pyr-tour-card {
  position: absolute;
  z-index: 20;
  width: 460px;
  max-width: calc(100% - 32px);
  background: #fff;
  border-radius: 16px;
  box-shadow:
    0 1px 0 rgba(0, 23, 56, 0.04),
    0 24px 48px -20px rgba(0, 23, 56, 0.28),
    0 12px 28px -16px rgba(0, 23, 56, 0.16);
  padding: 20px 22px;
  display: flex; flex-direction: column; gap: 12px;
  animation: pyrTourIn 0.35s var(--ease-emphasized);
}
@keyframes pyrTourIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.pyr-tour-card-head { display: flex; align-items: center; gap: 10px; font: 700 11.5px/1 var(--font-mono); letter-spacing: 0.06em; }
.pyr-tour-card-step { color: var(--accent); text-transform: uppercase; flex: 1; letter-spacing: 0.08em; }
.pyr-tour-card-live { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; background: rgba(255, 95, 31, 0.10); color: var(--accent); border-radius: 999px; letter-spacing: 0.14em; }
.pyr-tour-card-live i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); animation: hrb-pulse-ring 1.6s ease-in-out infinite; }
.pyr-tour-card-x { background: transparent; border: 0; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 6px; color: var(--ink-3); cursor: pointer; }
.pyr-tour-card-x:hover { background: rgba(0, 23, 56, 0.06); color: var(--ink); }
.pyr-tour-card-h { margin: 0; font: 700 22px/1.2 var(--font-display); letter-spacing: -0.02em; color: var(--ink); }
.pyr-tour-card-p { margin: 0; font: 400 14.5px/1.55 var(--font-body); color: var(--ink-2); text-wrap: pretty; }
.pyr-tour-card-hint { margin: 0; font: 600 13.5px/1.5 var(--font-body); color: var(--ink); }
.pyr-tour-card-foot { display: flex; align-items: center; gap: 16px; justify-content: space-between; margin-top: 4px; }
.pyr-tour-card-dots { display: inline-flex; gap: 6px; }
.pyr-tour-card-dots i { width: 8px; height: 8px; border-radius: 50%; background: rgba(0, 23, 56, 0.14); transition: background 0.25s ease, width 0.25s ease; }
.pyr-tour-card-dots i.is-on { background: var(--accent); width: 22px; border-radius: 4px; }
.pyr-tour-card-dots i.is-done { background: rgba(255, 95, 31, 0.45); }
.pyr-tour-card-actions { display: inline-flex; align-items: center; gap: 14px; }
.pyr-tour-card-skip { background: transparent; border: 0; font: 600 13px/1 var(--font-display); color: var(--ink-3); cursor: pointer; padding: 8px 4px; }
.pyr-tour-card-skip:hover { color: var(--ink); }
.pyr-tour-card-next { display: inline-flex; align-items: center; gap: 8px; background: var(--accent); color: #fff; border: 0; border-radius: 10px; padding: 11px 22px; font: 700 13.5px/1 var(--font-display); cursor: pointer; box-shadow: 0 8px 18px -8px rgba(255, 95, 31, 0.5); transition: background 0.2s ease, transform 0.15s ease; }
.pyr-tour-card-next:hover { background: #E04E10; transform: translateY(-1px); }

/* ── Consistency pass (2026-09-24) ──────────────────────────── */
.pac-pill { border-radius: 999px; min-height: 22px; padding: 3px 10px; font: 600 12px/1.2 var(--font-body); letter-spacing: 0; white-space: nowrap; }
.pac-pill-yellow-soft { background: #FFF3D1; color: #7A5400; }
.pac-pill-blue { background: #1497BA; color: #fff; }
.pac-pill-green { background: #0F8529; color: #fff; }
.pac-pill-red { background: #D22A2A; color: #fff; }
.pac-cld-status .pac-pill-green, .pac-notif-body .pac-pill-green { border-radius: 999px; }
/* readable table numbers + quiet IDs */
.pac-page table td.num, .pac-page table td .mono, .pac-page .pac-ref { color: #3F587F; font-variant-numeric: tabular-nums; }
.pac-page table td { font-variant-numeric: tabular-nums; }
.pac-page table td .pac-ref, .pac-page table td [class*="-id"]:not([class*="-idn-big"]) { font-size: 11px; font-weight: 500; letter-spacing: .02em; }
/* rows ease in when a list loads */
.pac-page tbody tr, .ess-shell .pac-page tbody tr { animation: pacRowIn .32s var(--ease-emphasized, cubic-bezier(.2,.8,.2,1)) backwards; }
.pac-page tbody tr:nth-child(2) { animation-delay: .03s; } .pac-page tbody tr:nth-child(3) { animation-delay: .06s; } .pac-page tbody tr:nth-child(4) { animation-delay: .09s; } .pac-page tbody tr:nth-child(5) { animation-delay: .12s; } .pac-page tbody tr:nth-child(n+6) { animation-delay: .15s; }
@keyframes pacRowIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
/* dashboard KPI strip */
.pac-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0 0 16px; }
.pac-kpi { display: flex; align-items: center; gap: 12px; text-align: left; padding: 14px 16px; background: #fff; border: 1px solid #E3E6EC; border-radius: 14px; cursor: pointer; transition: border-color .15s, box-shadow .15s, transform .15s; font: inherit; color: inherit; }
.pac-kpi:hover { border-color: #B8C1D1; box-shadow: 0 6px 16px -8px rgba(0,23,56,.16); transform: translateY(-1px); }
.pac-kpi-ic { width: 38px; height: 38px; flex: none; border-radius: 10px; display: grid; place-items: center; background: #FFF1EA; color: #FF5F1F; }
.pac-kpi-ic svg { width: 18px; height: 18px; }
.pac-kpi-tx { display: grid; min-width: 0; }
.pac-kpi-tx em { font: 400 12px/16px var(--font-body); font-style: normal; color: #3F587F; }
.pac-kpi-tx b { font: 700 20px/26px var(--font-body); color: var(--pac-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.pac-kpi-tx i { font: 400 12px/16px var(--font-body); font-style: normal; color: #6B7A93; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1100px) { .pac-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* payroll step tracker */
.pac-steps { list-style: none; margin: 0 0 14px; padding: 12px 16px; display: flex; gap: 0; background: #fff; border: 1px solid #E3E6EC; border-radius: 14px; overflow-x: auto; }
.pac-step { flex: 1 1 0; min-width: 150px; display: flex; align-items: center; gap: 10px; }
.pac-step:not(:last-child)::after { content: ""; flex: 1; min-width: 16px; height: 2px; border-radius: 2px; background: #E3E6EC; margin: 0 8px 0 2px; }
.pac-step.is-done:not(:last-child)::after { background: #0F8529; }
.pac-step-dot { width: 26px; height: 26px; flex: none; border-radius: 50%; display: grid; place-items: center; font: 700 12px var(--font-body); background: #F0F3F8; color: #3F587F; border: 1.5px solid #D6DCE6; box-sizing: border-box; }
.pac-step.is-done .pac-step-dot { background: #0F8529; border-color: #0F8529; color: #fff; }
.pac-step.is-on .pac-step-dot { background: #FF5F1F; border-color: #FF5F1F; color: #fff; box-shadow: 0 0 0 4px rgba(255,95,31,.15); }
.pac-step-tx { display: grid; flex: none; }
.pac-step-tx b { display: block; font: 600 13px/18px var(--font-body); color: var(--pac-ink); white-space: nowrap; }
.pac-step-tx i { display: block; font: 400 12px/16px var(--font-body); font-style: normal; color: #6B7A93; white-space: nowrap; }
.pac-step.is-todo .pac-step-tx b { color: #6B7A93; }
@media (prefers-reduced-motion: reduce) { .pac-page tbody tr { animation: none; } }

.pac-kpis { display: none !important; } /* hidden for now */

/* ── PAC tables match ESS tables ─────────────────────────────── */
.pac-page table:not([class*="pdf"]):not([class*="payslip"]) > thead > tr > th { font: 700 11px/1.3 var(--font-body) !important; letter-spacing: .06em !important; text-transform: uppercase; color: var(--pac-ink, #001738) !important; border-bottom: 1px solid #B8C1D1 !important; padding-top: 12px; padding-bottom: 12px; white-space: normal !important; overflow-wrap: normal; word-break: normal; vertical-align: bottom; }
.pac-page table:not([class*="pdf"]):not([class*="payslip"]) > tbody > tr > td { font-size: 13px; font-weight: 400; color: var(--pac-ink, #001738); padding-top: 13px; padding-bottom: 13px; }
.pac-page table:not([class*="pdf"]):not([class*="payslip"]) > tbody > tr:hover > td { background: #FFF9F6; }
.pac-empl-tbl .pac-empl-pos { font-weight: 400 !important; font-size: 13px !important; color: var(--pac-ink) !important; }
.pac-empl-tbl .pac-empl-hire { font-size: 13px !important; color: #3F587F !important; font-variant-numeric: tabular-nums; }
.pac-empl-id-text .pac-empl-id-id { font: 500 11px/1.3 var(--font-body) !important; color: var(--pac-orange, #FF5F1F) !important; letter-spacing: .02em; }
.pac-empl-id-text .pac-empl-id-name { font: 600 13px/1.35 var(--font-body) !important; color: var(--pac-ink) !important; }
.pac-empl-tbl .pac-av { width: 32px !important; height: 32px !important; font-size: 11px !important; flex: none; }
.pac-empl-emp-wrap { gap: 10px !important; }
.pac-empl-lock-bg { width: 28px !important; height: 28px !important; border-radius: 7px !important; }
.pac-empl-lock-bg svg { width: 14px !important; height: 14px !important; }
.pac-empl-tbl tbody tr { border-bottom-color: #E3E6EC !important; }

/* leave transaction detail: pinned drawer on the right edge of the console */
.pac-shell > .pac-leave-detail-overlay { position: absolute; inset: 0; z-index: 90; pointer-events: auto; background: rgba(0,23,56,.28); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); border-radius: inherit; overflow: hidden; justify-content: flex-end; }
.pac-shell > .pac-leave-detail-overlay .pac-leave-detail { margin: 0; height: 100%; max-height: 100%; border-radius: 0; border-left: 1px solid var(--pac-line); width: min(440px, 92%); box-shadow: -12px 0 32px -12px rgba(0,23,56,.18); }

.pac-lt-menu-wrap { position: relative; }
.pac-lt-menu { position: absolute; right: 8px; top: calc(100% - 6px); z-index: 30; min-width: 168px; padding: 6px; background: #fff; border: 1px solid #E3E6EC; border-radius: 12px; box-shadow: 0 12px 28px -8px rgba(0,23,56,.18); display: grid; gap: 2px; animation: pacRowIn .16s ease both; }
.pac-lt-menu button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; border: 0; background: transparent; border-radius: 8px; font: 500 13px var(--font-body); color: var(--pac-ink); cursor: pointer; text-align: left; }
.pac-lt-menu button:hover { background: #FFF1EA; color: #C2410C; }
.pac-lt-menu svg { width: 15px; height: 15px; flex: none; }

.pac-page table:not([class*="pdf"]):not([class*="payslip"]) > thead > tr > th { padding-right: 16px; }

.is-dark .pac-steps, .pac-shell.is-dark .pac-steps { background: #0C1F38; border-color: #1B2C48; }
.is-dark .pac-step-tx b { color: #E8EDF5; } .is-dark .pac-step-tx i { color: #8FA2BF; }
.is-dark .pac-step-dot { background: #16263F; border-color: #2A3E60; color: #C6D2E4; }
.is-dark .pac-step:not(:last-child)::after { background: #23375A; }
.is-dark .pac-lt-menu { background: #0C1F38; border-color: #1B2C48; }
.is-dark .pac-lt-menu button { color: #E8EDF5; } .is-dark .pac-lt-menu button:hover { background: #1B2C48; color: #FFB38F; }

.pac-shell tbody tr:focus-visible > td { background: #FFF1EA; box-shadow: inset 0 1px 0 #FF5F1F, inset 0 -1px 0 #FF5F1F; }
.pac-shell tbody tr:focus-visible { outline: none; }

/* ── Consistent list headers (title · search · filter · main action) ── */
.pac-page-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.pac-page-head > :first-child { margin-right: auto; }
.pac-page-head .pac-iconbtn, .pac-page-head .pac-btn, .pac-card-h2 .pac-iconbtn, .pac-card-h2 .pac-btn { height: 40px; }
.pac-card-h2 { display: flex; align-items: center; gap: 8px; }
.pac-card-h2 > :first-child { margin-right: auto; }
/* ── Illustrated empty states (matches ESS) ── */
.pac-empty-sm, .pac-page .pac-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 36px 16px; text-align: center; color: #3F587F; font: 400 13px/1.5 var(--font-body); }
.pac-empty-sm::before, .pac-page .pac-empty::before { content: ""; width: 72px; height: 72px; border-radius: 50%; background: #F0F3F8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238B9AB2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='2'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3Ccircle cx='18' cy='18' r='3.2' fill='%23fff' stroke='%23FF5F1F'/%3E%3C/svg%3E") center / 34px no-repeat; }
.is-dark .pac-empty-sm::before, .is-dark .pac-page .pac-empty::before { background-color: #16263F; }

/* list header order: title · search · filter · main action */
.pac-page-head [class*="search"], .pac-card-h2 [class*="search"] { order: 1; }
.pac-page-head [class*="filter"], .pac-card-h2 [class*="filter"] { order: 2; }
.pac-page-head [class*="hist"], .pac-card-h2 [class*="hist"], .pac-page-head [class*="toggle"], .pac-card-h2 [class*="toggle"] { order: 3; }
.pac-page-head .pac-btn-primary, .pac-card-h2 .pac-btn-primary, .pac-page-head [class*="-add"], .pac-card-h2 [class*="-add"], .pac-page-head [class*="-new"], .pac-card-h2 [class*="-new"] { order: 4; }
.pac-page-head > *, .pac-card-h2 > * { order: 0; }
.pac-page-head > [class*="search"], .pac-card-h2 > [class*="search"] { order: 1; }
.pac-page-head > [class*="filter"], .pac-card-h2 > [class*="filter"] { order: 2; }
.pac-page-head > .pac-btn-primary, .pac-card-h2 > .pac-btn-primary, .pac-page-head > [class*="-add"], .pac-card-h2 > [class*="-add"], .pac-page-head > [class*="-new"], .pac-card-h2 > [class*="-new"] { order: 4; }
.pac-page-head > :first-child, .pac-card-h2 > :first-child { order: -1; }
.pac-page-head div:has(> [class*="search"], > [class*="filter"]), .pac-card-h2 div:has(> [class*="search"], > [class*="filter"]) { display: flex; align-items: center; gap: 8px; }

/* Payrolls card (Open payroll period) — refined */
.pac-prx { padding: 24px !important; }
.pac-prx-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.pac-prx-title h3 { margin: 0; font: 600 18px/26px var(--font-body); color: var(--pac-ink); }
.pac-prx-title p { margin: 2px 0 0; font: 400 13px/18px var(--font-body); color: var(--pac-mute); }
.pac-prx-head .pac-row-actions { gap: 12px; }
.pac-prx-head .pac-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.pac-prx-wrap { border: 1px solid #E3E6EC; border-radius: 12px; overflow: hidden; }
.pac-prx-group { display: flex; align-items: center; gap: 10px; padding: 12px 20px; background: #F7F9FC; border-bottom: 1px solid #E3E6EC; font: 400 14px var(--font-body); color: var(--pac-ink); }
.pac-prx-group b { font-weight: 600; }
.pac-prx-group-ic { width: 26px; height: 26px; border-radius: 8px; background: #fff; border: 1px solid #E3E6EC; display: inline-grid; place-items: center; color: #3F587F; }
.pac-prx-count { margin-left: 2px; padding: 1px 8px; border-radius: 999px; background: #FFF4E5; color: #8A5A00; font: 600 12px/18px var(--font-body); }
.pac-prx-scroll { overflow-x: auto; }
.pac-prx-tbl { width: 100%; min-width: 760px; border-collapse: collapse; table-layout: fixed; font: 400 14px/20px var(--font-body); color: var(--pac-ink); }
.pac-prx-tbl th { text-align: left; padding: 10px 20px; font: 600 12px/18px var(--font-body); color: #3F587F; text-transform: none; letter-spacing: 0; background: #fff; border-bottom: 1px solid #E3E6EC; white-space: nowrap; }
.pac-prx-tbl td { padding: 14px 20px; vertical-align: middle; border: 0; white-space: nowrap; }
.pac-prx-tbl tbody tr { cursor: pointer; transition: background .15s var(--ease-standard, ease); }
.pac-prx-tbl tbody tr:hover { background: #F7F9FC; }
.pac-prx-tbl tbody tr + tr td { border-top: 1px solid #E3E6EC; }
.pac-prx-id { color: var(--pac-orange); font-weight: 600; }
.pac-prx-name { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.pac-prx-sub { margin-top: 2px; font-size: 13px; color: var(--pac-mute); }
.pac-prx-date { font-variant-numeric: tabular-nums; }
.pac-prx-go { text-align: right; padding-right: 12px !important; }
.pac-prx-go span { display: inline-flex; align-items: center; gap: 2px; padding: 6px 8px 6px 12px; border-radius: 999px; font-weight: 600; color: var(--pac-orange); transition: background .15s ease; }
.pac-prx-go svg { transition: transform .15s ease; }
/* Row hover highlights ONLY the "View/Open ›" pill - never the kebab next to it */
.pac-prx-tbl tbody tr:hover .pac-prx-go > span:first-child > svg,
.pac-prx-tbl tbody tr:hover .pac-cldx-act-in > span:first-child > svg { transform: translateX(2px); }
.pac-prx-tbl tbody tr:hover .pac-prx-go > span:first-child,
.pac-prx-tbl tbody tr:hover .pac-cldx-act-in > span:first-child { background: #FFF1EA; }
.pac-prx-tbl tbody td .pac-pill { display: inline-flex; }

.pac-prx-head .pac-row-actions { gap: 8px; }
.pac-prx .btn.pac-prx-new { height: 36px; padding: 0 16px 0 12px; border-radius: 8px; font: 600 14px/20px var(--font-body); gap: 6px; }
.pac-prx .btn.pac-prx-new svg { transition: transform var(--motion-fast, 120ms) var(--ease-spring, ease); }
.pac-prx .btn.pac-prx-new:hover svg { transform: rotate(90deg); }
.pac-prx .btn.pac-prx-kebab { width: 36px; height: 36px; padding: 0; border: 0 !important; border-radius: 8px; color: #3F587F; background: transparent; }
.pac-prx .btn.pac-prx-kebab:hover { background: #F0F3F8; color: var(--pac-ink); }

/* Closed periods card */
.pac-clx { padding: 24px !important; }
.pac-clx-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.pac-clx-title h3 { margin: 0; font: 600 18px/26px var(--font-body); color: var(--pac-ink); }
.pac-clx-title p { margin: 2px 0 0; font: 400 13px/18px var(--font-body); color: var(--pac-mute); }
.pac-clx-year { display: inline-flex; align-items: center; gap: 4px; padding: 4px; border-radius: 999px; background: #F0F3F8; }
.pac-clx-yb { width: 30px; height: 30px; border: 0; border-radius: 999px; background: transparent; color: #1A3E6D; display: inline-grid; place-items: center; cursor: pointer; transition: background .15s ease, color .15s ease; }
.pac-clx-yb:hover:not(:disabled) { background: #fff; box-shadow: 0 1px 2px rgba(0,23,56,.08); }
.pac-clx-yb:disabled { color: #B8C1D1; cursor: default; }
.pac-clx-yv { min-width: 48px; text-align: center; font: 600 14px/20px var(--font-body); color: var(--pac-ink); font-variant-numeric: tabular-nums; }
.pac-clx-wrap { border: 1px solid #E3E6EC; border-radius: 12px; overflow: hidden; }
.pac-clx-scroll { overflow-x: auto; }
.pac-clx-tbl { width: 100%; min-width: 820px; border-collapse: collapse; table-layout: fixed; font: 400 14px/20px var(--font-body); color: var(--pac-ink); }
.pac-clx-tbl th { text-align: left; padding: 10px 20px; font: 600 12px/18px var(--font-body); color: #3F587F; background: #F7F9FC; border-bottom: 1px solid #E3E6EC; white-space: nowrap; }
.pac-clx-tbl td { padding: 12px 20px; vertical-align: middle; border: 0; white-space: nowrap; text-align: left; }
.pac-clx-tbl tbody tr { cursor: pointer; transition: background .15s ease; }
.pac-clx-tbl tbody tr + tr td { border-top: 1px solid #E3E6EC; }
.pac-clx-tbl tbody tr:hover { background: #F7F9FC; }
.pac-clx-period { display: flex; align-items: center; gap: 12px; }
.pac-clx-cal { flex: none; width: 40px; height: 40px; border-radius: 10px; background: #fff; border: 1px solid #E3E6EC; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; }
.pac-clx-cal i { font: 600 11px/14px var(--font-body); font-style: normal; color: var(--pac-orange); text-transform: uppercase; }
.pac-clx-cal b { font: 600 10px/12px var(--font-body); color: #8B9AB2; }
.pac-clx-name { font-weight: 600; }
.pac-clx-sub { font-size: 12px; line-height: 18px; color: var(--pac-mute); }
.pac-clx-num { font-variant-numeric: tabular-nums; }
.pac-clx-tbl td .pac-pill { display: inline-flex; }
.pac-clx-go { text-align: right !important; padding-right: 12px !important; }
.pac-clx-go span { display: inline-flex; align-items: center; gap: 2px; padding: 6px 8px 6px 12px; border-radius: 999px; font-weight: 600; color: var(--pac-orange); transition: background .15s ease; }
.pac-clx-go svg { transition: transform .15s ease; }
.pac-clx-tbl tbody tr:hover .pac-clx-go > span:first-child { background: #FFF1EA; }
.pac-clx-tbl tbody tr:hover .pac-clx-go > span:first-child > svg { transform: translateX(2px); }

/* Closed detail · Payrolls card */
.pac-prx-group-btn { width: 100%; border: 0; border-bottom: 1px solid #E3E6EC; text-align: left; cursor: pointer; font-family: var(--font-body); }
.pac-prx-group-btn.is-collapsed { border-bottom-color: transparent; }
.pac-prx-group-btn:hover { background: #F0F3F8; }
.pac-prx-caret { margin-left: auto; color: #3F587F; display: inline-grid; transition: transform .2s var(--ease-standard, ease); }
.pac-prx-group-btn.is-collapsed .pac-prx-caret { transform: rotate(-90deg); }
.pac-prx-count-ok { background: #E7F6EC; color: #0F6B22; }
.pac-cld-pr .pac-prx-wrap { overflow: visible; }
.pac-cld-pr .pac-prx-group-btn { border-radius: 12px 12px 0 0; }
.pac-cld-pr .pac-prx-group-btn.is-collapsed { border-radius: 12px; }
.pac-cldx-scroll { overflow: visible; }
@media (max-width: 900px) { .pac-cldx-scroll { overflow-x: auto; } }
.pac-cldx-act { white-space: nowrap; }
.pac-cldx-act > span { vertical-align: middle; margin-right: 4px; }
.pac-cldx-act .pac-cld-pr-menu-wrap { position: relative; display: inline-block; vertical-align: middle; }
.pac-cldx-act .pac-cld-pr-menu { right: 0; left: auto; top: calc(100% + 6px); z-index: 30; text-align: left; }

/* Leave balances table — matches Payrolls card table */
.pac-balx-wrap .pac-bal-scroll { overflow-x: auto; }
.pac-page table.pac-balx { border-collapse: collapse; width: 100%; min-width: 1000px; table-layout: fixed; }
.pac-page table.pac-balx > thead > tr > th { background: #F7F9FC !important; padding: 12px 16px !important; border-bottom: 1px solid #E3E6EC !important; vertical-align: bottom !important; text-align: left !important; color: var(--pac-ink) !important; }
.pac-page table.pac-balx > thead > tr > th:first-child, .pac-page table.pac-balx > tbody > tr > td:first-child { padding-left: 20px !important; }
.pac-page table.pac-balx > thead > tr > th:last-child, .pac-page table.pac-balx > tbody > tr > td:last-child { padding-right: 12px !important; text-align: right !important; }
.pac-balx .pac-bal-th-b { font: 700 11px/15px var(--font-body); letter-spacing: .06em; text-transform: uppercase; color: var(--pac-ink); }
.pac-balx .pac-bal-th-s { margin-top: 2px; font: 400 12px/16px var(--font-body); letter-spacing: 0; text-transform: none; color: var(--pac-mute); }
.pac-page table.pac-balx > tbody > tr > td { padding: 12px 16px !important; border-bottom: 1px solid #E3E6EC !important; text-align: left !important; font-size: 14px; vertical-align: middle; }
.pac-page table.pac-balx > tbody > tr:last-child > td { border-bottom: 0 !important; }
.pac-balx .pac-bal-num { font-family: var(--font-body) !important; font-variant-numeric: tabular-nums; }
.pac-balx .pac-bal-num:empty::before { content: "0"; }
.pac-balx .pac-empl-n { color: var(--pac-mute) !important; }
.pac-prx .pac-row-actions .btn.pac-prx-kebab svg { width: 18px; height: 18px; }
.pac-shell.is-dark .pac-page table.pac-balx > thead > tr > th { background: #0A1B31 !important; border-color: #1B2C48 !important; }
.pac-shell.is-dark .pac-balx .pac-bal-th-b { color: #C6D2E4; }
.pac-shell.is-dark .pac-page table.pac-balx > tbody > tr > td { border-color: #16263F !important; }

.pac-page table.pac-balx { min-width: 1180px; }
.pac-page table.pac-balx > thead > tr > th { vertical-align: middle !important; white-space: nowrap !important; font: 700 11px/16px var(--font-body) !important; letter-spacing: .06em !important; text-transform: uppercase !important; }
.pac-page table.pac-balx > tbody > tr > td.pac-bal-num { font-size: 14px !important; }

/* Leave balances — same table style as Leave transactions */
.pac-page table.pac-bal2 { min-width: 1180px; }
.pac-page table.pac-bal2 > thead > tr > th { white-space: nowrap !important; vertical-align: bottom; text-align: left !important; }
.pac-page table.pac-bal2 > tbody > tr > td { text-align: left !important; }
.pac-page table.pac-bal2 > tbody > tr > td.pac-bal-num { font-family: var(--font-body) !important; font-size: 13px; font-variant-numeric: tabular-nums; }
.pac-page table.pac-bal2 > thead > tr > th:last-child, .pac-page table.pac-bal2 > tbody > tr > td:last-child { text-align: right !important; }

/* Headcount card alignment */
.pac-card .pac-hc-row, .pac-card .pac-evt-row.pac-hc-head { display: grid !important; grid-template-columns: 24px minmax(0,1fr) 64px 64px !important; column-gap: 10px !important; align-items: center; }
.pac-card .pac-evt-row.pac-hc-head { padding: 14px 0 10px !important; border-bottom: 1px solid var(--pac-line); }
.pac-card .pac-hc-head span:nth-child(3), .pac-card .pac-hc-head span:nth-child(4) { text-align: left !important; align-self: end; line-height: 1.3; }
.pac-card .pac-hc-row { padding: 14px 0 !important; }
.pac-card .pac-hc-row .pac-entity-flag { justify-self: start; line-height: 1; }
.pac-card .pac-hc-n { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pac-card .pac-hc-row .pac-pill { justify-self: start; min-width: 36px; justify-content: center; }
.pac-card .pac-hc-row .pac-hc-ring { justify-self: start; margin: 0 !important; width: 30px; height: 30px; }

.pac-entity-flag { display: inline-flex; align-items: center; }
.pac-card .pac-hc-row, .pac-card .pac-evt-row.pac-hc-head { grid-template-columns: 22px minmax(0,1fr) 56px 52px !important; column-gap: 8px !important; }

.pac-empl-id-text .pac-empl-name-line { display: flex !important; align-items: center; gap: 8px; flex-wrap: wrap; }
.pac-empl-name-line .pac-pill { margin: 0 !important; font-size: 12px; line-height: 18px; padding: 1px 8px; }

/* Employee · Benefits tab */
.pac-benx { border: 1px solid #E3E6EC; border-radius: 12px; overflow: hidden; }
.pac-page table.pac-benx-tbl { width: 100%; border-collapse: collapse; table-layout: fixed; }
.pac-page table.pac-benx-tbl > thead > tr > th { background: #F7F9FC !important; padding: 10px 20px !important; border-bottom: 1px solid #E3E6EC !important; text-align: left; white-space: nowrap; }
.pac-page table.pac-benx-tbl > tbody > tr > td { padding: 14px 20px !important; border-bottom: 1px solid #E3E6EC; vertical-align: middle; font-size: 14px !important; line-height: 20px; text-align: left; }
.pac-page table.pac-benx-tbl > tbody > tr:last-child > td { border-bottom: 0; }
.pac-benx-n { font-weight: 600; color: var(--pac-ink); }
.pac-benx-d { color: #3F587F; }
.pac-benx-amt { font-weight: 600; color: var(--pac-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pac-benx-sub { font-size: 12px; line-height: 16px; color: var(--pac-mute); margin-top: 2px; }
.pac-benx-tbl td .pac-pill { display: inline-flex; }
.pac-benx-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 20px; background: #F7F9FC; border-top: 1px solid #E3E6EC; font: 400 13px/18px var(--font-body); color: #3F587F; flex-wrap: wrap; }
.pac-benx-foot b { color: var(--pac-ink); font-weight: 600; }
@media (max-width: 760px) { .pac-benx { overflow-x: auto; } .pac-page table.pac-benx-tbl { min-width: 640px; } }
.pac-shell.is-dark .pac-benx { border-color: #1B2C48; }
.pac-shell.is-dark .pac-page table.pac-benx-tbl > thead > tr > th, .pac-shell.is-dark .pac-benx-foot { background: #0A1B31 !important; border-color: #1B2C48 !important; }
.pac-shell.is-dark .pac-page table.pac-benx-tbl > tbody > tr > td { border-color: #16263F; }
.pac-shell.is-dark .pac-benx-n, .pac-shell.is-dark .pac-benx-amt, .pac-shell.is-dark .pac-benx-foot b { color: #E6ECF5; }

/* Payrolls tables — no overlap, scroll on small screens */
.pac-prx-scroll { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
.pac-page table.pac-prx-tbl { min-width: 980px !important; table-layout: auto !important; }
.pac-page table.pac-prx-tbl > thead > tr > th, .pac-page table.pac-prx-tbl > tbody > tr > td { white-space: nowrap !important; }
.pac-prx-tbl .pac-prx-name { flex-wrap: nowrap !important; }
.pac-prx-tbl .pac-pill { white-space: nowrap; }
.pac-cld-pr .pac-prx-scroll.pac-cldx-scroll { overflow: visible !important; }
@media (max-width: 1100px) { .pac-cld-pr .pac-prx-scroll.pac-cldx-scroll { overflow-x: auto !important; } }

/* New earning / deduction sheet — cleanup */
.pac-pemod-submodal-overlay { background: rgba(0,23,56,.32) !important; backdrop-filter: blur(6px) !important; -webkit-backdrop-filter: blur(6px) !important; border-radius: inherit; }
.pac-pemod-newearn .pac-pemod-submodal-h { padding: 18px 24px !important; }
.pac-pemod-newearn .pac-pemod-submodal-h h3 { font: 600 20px/28px var(--font-body) !important; letter-spacing: 0 !important; }
.pac-pemod-newearn .btn.pac-ne-x { width: 36px; height: 36px; padding: 0; color: #3F587F; }
.pac-pemod-newearn .pac-pemod-newearn-body { padding: 20px 24px 24px !important; }
.pac-pemod-newearn .pac-pemod-newearn-type { display: flex; align-items: center; gap: 24px; margin-bottom: 20px; }
.pac-pemod-newearn .pac-pemod-newearn-type > label:first-child { font: 600 14px var(--font-body); color: var(--pac-ink); margin-right: 4px; }
.pac-pemod-newearn .pac-pemod-newearn-row { display: grid !important; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr) 120px 36px !important; gap: 16px !important; align-items: center !important; padding: 12px 0 !important; border-bottom: 1px solid #E3E6EC; }
.pac-pemod-newearn .pac-pemod-newearn-row-h { padding: 0 0 8px !important; border-bottom: 1px solid #E3E6EC; }
.pac-pemod-newearn .pac-pemod-newearn-row-h > span { font: 700 11px/16px var(--font-body) !important; letter-spacing: .06em; text-transform: uppercase; color: var(--pac-ink) !important; }
.pac-pemod-newearn .pac-pemod-newearn-row-h em { color: #D22A2A; font-style: normal; }
.pac-pemod-newearn .pac-pemod-pe { height: 40px !important; padding: 0 12px !important; border: 1px solid #B8C1D1 !important; border-radius: 8px !important; font: 400 14px var(--font-body) !important; width: 100%; display: flex; align-items: center; justify-content: space-between; background: #fff; }
.pac-pemod-newearn .pac-pemod-pe.is-open, .pac-pemod-newearn .pac-pemod-pe:focus-visible { border-color: #FF5F1F !important; box-shadow: 0 0 0 3px rgba(255,95,31,.18); outline: none; }
.pac-pemod-newearn .pac-pemod-newearn-amt { height: 40px !important; display: flex !important; align-items: center; gap: 8px; padding: 0 12px !important; border: 1px solid #B8C1D1 !important; border-radius: 8px !important; background: #fff; }
.pac-pemod-newearn .pac-pemod-newearn-amt:focus-within { border-color: #FF5F1F !important; box-shadow: 0 0 0 3px rgba(255,95,31,.18); }
.pac-pemod-newearn .pac-pemod-newearn-amt input { flex: 1; min-width: 0; border: 0 !important; outline: none; background: transparent; font: 400 14px var(--font-body); color: var(--pac-ink); padding: 0 !important; height: 100%; font-variant-numeric: tabular-nums; }
.pac-pemod-newearn .pac-pemod-newearn-amt span { font: 600 12px var(--font-body); color: #8B9AB2; }
.pac-pemod-newearn .pac-pemod-newearn-unit { font: 400 14px var(--font-body); color: var(--pac-ink); }
.pac-pemod-newearn .btn.pac-pemod-newearn-del { width: 36px; height: 36px; padding: 0; color: #3F587F; background: transparent !important; }
.pac-pemod-newearn .btn.pac-pemod-newearn-del:hover:not(:disabled) { background: #FFF1F0 !important; color: #B42318; }
.pac-pemod-newearn .btn.pac-pemod-newearn-del:disabled { color: #B8C1D1; cursor: default; }
.pac-pemod-newearn .btn.pac-ne-add { margin-top: 16px; height: 36px; padding: 0 14px 0 12px; font-size: 14px; gap: 6px; }
.pac-pemod-newearn .pac-pemod-edit-notice { display: flex !important; align-items: flex-start; gap: 10px; margin: 20px 0 0 !important; padding: 12px 14px !important; border-radius: 10px; background: #FFF8E6 !important; color: #6B4700 !important; font: 400 13px/18px var(--font-body) !important; justify-content: flex-start !important; text-align: left !important; border: 0 !important; }
.pac-pemod-newearn .pac-pemod-edit-notice-ic { flex: none; width: 18px; height: 18px; color: #B27A00; display: inline-grid; place-items: center; }
.pac-pemod-newearn .pac-pemod-edit-notice-ic svg { width: 16px; height: 16px; }
.pac-pemod-newearn .pac-pemod-edit-foot { display: flex !important; justify-content: flex-end; align-items: center; gap: 8px; margin-top: 20px !important; padding-top: 16px !important; border-top: 1px solid #E3E6EC; }
.pac-pemod-newearn .pac-pemod-edit-foot .btn { height: 40px; padding: 0 18px; font-size: 14px; }
@media (max-width: 720px) {
  .pac-pemod-newearn .pac-pemod-newearn-row { grid-template-columns: minmax(0,1fr) 36px !important; }
  .pac-pemod-newearn .pac-pemod-newearn-row > .pac-pemod-pe-wrap { grid-column: 1 / -1; }
  .pac-pemod-newearn .pac-pemod-newearn-row-h > span:nth-child(n+2) { display: none; }
  .pac-pemod-newearn .pac-pemod-newearn-unit { display: none; }
}

/* Employee pay modal — rounded card; sub-modal centered */
.pac-pemod { border-radius: 16px !important; border: 1px solid #E3E6EC; }
.pac-pemod-meta { display: flex; align-items: center; gap: 8px; }
.pac-pemod-submodal-overlay { align-items: flex-start !important; justify-content: center !important; padding: 24px !important; border-radius: 16px; }
.pac-pemod-submodal { position: sticky !important; top: 24px; border-radius: 16px !important; max-width: 760px !important; width: 100% !important; max-height: min(calc(100vh - 160px), 720px) !important; box-shadow: 0 24px 48px rgba(0,23,56,.16) !important; animation: pacSubmPop .22s cubic-bezier(.2,.8,.2,1) both !important; }
@keyframes pacSubmPop { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .pac-pemod-submodal { animation: none !important; } }

.pac-pemod-submodal-overlay.is-shell { position: absolute !important; inset: 0 !important; z-index: 400 !important; align-items: center !important; border-radius: inherit; }
.pac-pemod-submodal-overlay.is-shell .pac-pemod-submodal { position: relative !important; top: auto; max-height: calc(100% - 48px) !important; }
.pac-pemod-newearn .btn.btn-primary:disabled { background: #E5E7EB !important; color: #8B9AB2 !important; box-shadow: none !important; transform: none !important; cursor: not-allowed; }

/* clickable table rows + kebab menu danger item */
.pac-row-click { cursor: pointer; }
.pac-row-click:hover > td { background: #F0F3F8; }
.pac-rowmenu button.is-danger { color: #D22A2A; }
.pac-rowmenu button.is-danger:hover { background: #FFF9F9; color: #D22A2A; }
.pac-tpl-tbl, .pac-card:has(.pac-rowmenu) { overflow: visible; }
.is-dark .pac-row-click:hover > td { background: #12263F; }

/* Closed → month detail · Payrolls table: fit the card (no spill past the border) */
.pac-page .pac-cld-pr table.pac-prx-tbl { min-width: 0 !important; width: 100%; table-layout: fixed !important; }
.pac-page .pac-cld-pr table.pac-prx-tbl > thead > tr > th,
.pac-page .pac-cld-pr table.pac-prx-tbl > tbody > tr > td { white-space: normal !important; overflow-wrap: anywhere; }
.pac-page .pac-cld-pr table.pac-prx-tbl .pac-pill,
.pac-page .pac-cld-pr table.pac-prx-tbl .pac-cldx-act { white-space: nowrap !important; }
.pac-cld-pr .pac-prx-tbl td.pac-cldx-act { text-align: right; padding-right: 16px; }
.pac-cld-pr .pac-prx-tbl tbody tr { cursor: pointer; }
.pac-cld-pr .pac-prx-tbl tbody tr:hover > td { background: #F7F9FC; }
.pac-cld-pr .pac-prx-tbl tbody tr:last-child > td:first-child { border-bottom-left-radius: 12px; }
.pac-cld-pr .pac-prx-tbl tbody tr:last-child > td:last-child { border-bottom-right-radius: 12px; }
@media (max-width: 1100px) { .pac-page .pac-cld-pr table.pac-prx-tbl { min-width: 760px !important; } }
.pac-cld-pr .pac-prx-tbl td.pac-cldx-act { padding-left: 8px; }
.pac-cld-pr .pac-prx-tbl td.pac-cldx-act > span { margin-right: 6px; }
.pac-cld-pr .pac-cldx-act-in { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.pac-cld-pr .pac-prx-tbl td.pac-cldx-act > span { margin-right: 0; }
.pac-cld-pr .pac-cldx-act .pac-rowmenu { top: calc(100% + 4px); right: 0; }
/* kebab gets its own hover only when the pointer is on it */
.pac-rowmenu-wrap, .pac-rowmenu-wrap .pac-tbl-more { background: transparent !important; }
.pac-tbl-more:hover, .pac-tbl-more[aria-expanded="true"] { background: #F0F3F8 !important; color: var(--pac-orange) !important; border-radius: 8px; }
/* shell-level modal scrim: covers sidebar + content, sits above the sidebar toggle */
.pac-shell-inner > .pac-modal-overlay { position: absolute; inset: 0; z-index: 120; border-radius: inherit; }
.pac-clx-tbl .pac-cldx-act-in { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.pac-clx-tbl tbody tr:hover .pac-cldx-act-in > span:first-child { background: #FFF1EA; }
.pac-clx-tbl tbody tr:hover .pac-cldx-act-in > span:first-child > svg { transform: translateX(2px); }
.pac-clx-wrap, .pac-clx-scroll { overflow: visible; }
/* wrap is overflow:visible (so the kebab menu can escape) - round the header/last-row corners directly */
.pac-clx-tbl { border-collapse: separate; border-spacing: 0; }
.pac-clx-tbl thead th:first-child { border-top-left-radius: 12px; }
.pac-clx-tbl thead th:last-child { border-top-right-radius: 12px; }
.pac-clx-tbl tbody tr:last-child > td:first-child { border-bottom-left-radius: 12px; }
.pac-clx-tbl tbody tr:last-child > td:last-child { border-bottom-right-radius: 12px; }
/* Report templates: Generate Report + kebab on one centred line */
.pac-tpl-act-in { display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.pac-tpl-act-in > .pac-link { line-height: 20px; white-space: nowrap; }
.pac-tpl-tbl td { vertical-align: middle; }
/* Persisted imports: bottom padding matches the card's sides (row was flush with the card edge) */
.pac-if-card > .pac-persist-row { margin: 0 24px 24px; }

/* ════════════════════════════════════════════════════════════════
   Ported from design-src/explore console-prototype.css (recent update):
   My Apps panel, Employees row-selection, collapsible sidebar rail
   (tooltips + flyouts), sidebar tool tooltips.
   ════════════════════════════════════════════════════════════════ */

/* ── My Apps panel (PAC ⇄ ESS) ── */
.pac-apps-panel .pac-spanel-body.pac-apps, .pac-spanel-body.pac-apps { display: grid; align-content: start; gap: 10px; padding: 20px 17px; }
.pac-apps-row { display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 14px; width: 100%; text-align: left; background: #fff; border: 1px solid #B8C1D1; border-radius: 12px; padding: 14px 14px 14px 16px; cursor: pointer; font-family: var(--font-body); transition: border-color .14s, box-shadow .14s, transform .14s; }
.pac-apps-row:hover:not(.is-current) { border-color: #001738; box-shadow: 0 4px 8px rgba(0,23,56,.08); transform: translateY(-1px); }
.pac-apps-row:focus-visible { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #FF5F1F; }
.pac-apps-row.is-current { border-color: #FF5F1F; background: #FFF9F6; cursor: default; }
.pac-apps-ic { width: 40px; height: 40px; border-radius: 10px; background: #F0F3F8; color: #FF5F1F; display: grid; place-items: center; }
.pac-apps-ic svg { width: 20px; height: 20px; }
.pac-apps-row.is-current .pac-apps-ic { background: #fff; }
.pac-apps-txt { display: grid; gap: 3px; min-width: 0; }
.pac-apps-txt b { font: 600 14px/1.3 var(--font-body); color: #001738; }
.pac-apps-txt span { font: 400 12.5px/1.5 var(--font-body); color: #3F587F; text-wrap: pretty; }
.pac-apps-arr { color: #8B9AB2; display: grid; place-items: center; transition: transform .14s, color .14s; }
.pac-apps-arr svg { width: 16px; height: 16px; }
.pac-apps-arr em { font: 600 11px/1 var(--font-body); font-style: normal; color: #A53F0F; background: #FFE3D7; border-radius: 999px; padding: 4px 8px; }
.pac-apps-row:hover:not(.is-current) .pac-apps-arr { color: #FF5F1F; transform: translateX(2px); }

/* ── Employees table · selection like Integration ── */
.pac-empl-tbl th.pac-empl-ck, .pac-empl-tbl td.pac-empl-ck { text-align: center; padding-left: 0 !important; padding-right: 0 !important; }
.pac-empl-tbl th.pac-empl-ck .pac-int-chk, .pac-empl-tbl td.pac-empl-ck .pac-int-chk { margin: 0 auto; }
.pac-page .pac-empl-tbl tbody tr { position: relative; transition: background 120ms; }
.pac-page .pac-empl-tbl tbody tr:hover, .pac-page .pac-empl-tbl tbody tr.is-sel { background: #FFF9F6; }
.pac-page .pac-empl-tbl tbody tr.is-sel > td:first-child { position: relative; }
.pac-page .pac-empl-tbl tbody tr.is-sel > td:first-child::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: #FF5F1F; border-radius: 0 2px 2px 0; }
.pac-int-bulk-ic svg { width: 16px; height: 16px; }
.pac-int-bulk-x svg { width: 14px; height: 14px; }

/* ── PAC collapsible sidebar (same behaviour as ESS) ── */
.pac-side:not(.ess-side) { overflow: visible; }
.pac-side:not(.ess-side) .pac-brand { position: relative; overflow: visible; }
.pac-side:not(.ess-side) .pac-brand-collapse { z-index: 30; }
.pac-shell-inner:has(> .pac-side:not(.ess-side).is-collapsed) { grid-template-columns: 76px minmax(0, 1fr); }
.pac-shell-inner { transition: grid-template-columns .28s var(--ease-emphasized, cubic-bezier(.2,0,0,1)); }
.pac-side:not(.ess-side).is-collapsed .pac-brand-l,
.pac-side:not(.ess-side).is-collapsed .pac-entity-name,
.pac-side:not(.ess-side).is-collapsed .pac-nav-l,
.pac-side:not(.ess-side).is-collapsed .pac-nav-chev,
.pac-side:not(.ess-side).is-collapsed .pac-nav-children,
.pac-side:not(.ess-side).is-collapsed .pac-nav-explore,
.pac-side:not(.ess-side).is-collapsed .pac-user-text,
.pac-side:not(.ess-side).is-collapsed .pac-side-foot,
.pac-side:not(.ess-side).is-collapsed .pac-setnav-l,
.pac-side:not(.ess-side).is-collapsed .pac-setnav-chev,
.pac-side:not(.ess-side).is-collapsed .pac-setnav-kids { display: none; }
.pac-side:not(.ess-side).is-collapsed .pac-entity-tools { flex-direction: column; align-items: center; gap: 4px; }
.pac-side:not(.ess-side).is-collapsed .pac-brand { justify-content: center; padding-left: 0; padding-right: 0; }
.pac-side:not(.ess-side).is-collapsed .pac-entity { padding-left: 0; padding-right: 0; }
.pac-side:not(.ess-side).is-collapsed .pac-nav-item,
.pac-side:not(.ess-side).is-collapsed .pac-setnav-h,
.pac-side:not(.ess-side).is-collapsed .pac-setnav-back { justify-content: center; padding-left: 0; padding-right: 0; }
.pac-side:not(.ess-side).is-collapsed .pac-user { justify-content: center; }
.pac-side:not(.ess-side).is-collapsed .pac-brand-collapse svg { transform: rotate(180deg); }
.pac-side:not(.ess-side).is-collapsed .pac-nav { overflow: visible; }
.pac-side:not(.ess-side) .pac-brand-collapse svg { transition: transform .28s var(--ease-emphasized, cubic-bezier(.2,0,0,1)); }
/* tooltips on the collapsed rail */
.pac-nav-tip { display: none; }
.pac-side:not(.ess-side).is-collapsed .pac-nav-item { position: relative; }
.pac-side:not(.ess-side).is-collapsed .pac-nav-tip { display: block; position: absolute; left: calc(100% + 10px); top: 50%; transform: translateY(-50%); z-index: 40; background: var(--pac-ink, #001738); color: #fff; border-radius: 6px; padding: 6px 10px; font: 600 12px var(--font-body); white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .12s var(--ease-standard); box-shadow: var(--shadow-default); }
.pac-side:not(.ess-side).is-collapsed .pac-nav-item:hover .pac-nav-tip, .pac-side:not(.ess-side).is-collapsed .pac-nav-item:focus-visible .pac-nav-tip { opacity: 1; }
/* groups open as a flyout on the collapsed rail (gated on collapsed state) */
.pac-nav-fly { display: none; }
.pac-side:not(.ess-side).is-collapsed .pac-nav-group { position: relative; }
.pac-side:not(.ess-side).is-collapsed .pac-nav-fly { display: flex; flex-direction: column; gap: 2px; position: absolute; left: calc(100% + 8px); top: 0; z-index: 45; min-width: 190px; background: #fff; border: 1px solid var(--pac-line); border-radius: 10px; box-shadow: var(--shadow-large); padding: 8px; opacity: 0; visibility: hidden; transform: translateX(-4px); transition: opacity .14s var(--ease-standard), transform .14s var(--ease-standard), visibility .14s; }
.pac-side:not(.ess-side).is-collapsed .pac-nav-group:hover .pac-nav-fly, .pac-side:not(.ess-side).is-collapsed .pac-nav-group:focus-within .pac-nav-fly { opacity: 1; visibility: visible; transform: none; }
.pac-nav-fly-h { padding: 4px 10px 6px; font: 700 10px/1.4 var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--pac-mute); }
.pac-nav-fly-i { text-align: left; background: transparent; border: 0; cursor: pointer; padding: 8px 10px; border-radius: 6px; font: 500 13px var(--font-body); color: var(--pac-ink); white-space: nowrap; }
.pac-nav-fly-i:hover { background: #F0F3F8; }
.pac-nav-fly-i.is-on { color: var(--pac-orange, #FF5F1F); font-weight: 700; background: var(--pac-orange-soft, #FFEFE9); }
@media (prefers-reduced-motion: reduce) { .pac-shell-inner, .pac-side .pac-brand-collapse svg { transition: none; } }

/* ── sidebar tool icons: tooltip (below when open, to the right when collapsed) ── */
.pac-entity-tools .pac-tool { position: relative; }
.pac-entity-tools .pac-tool > .pac-tool-tip { display: block; width: auto; height: auto; min-width: 0; margin: 0; }
.pac-tool-tip { position: absolute; left: 50%; top: calc(100% + 8px); transform: translate(-50%, -2px); z-index: 50; background: var(--pac-ink, #001738); color: #fff; border-radius: 6px; padding: 6px 10px; font: 600 12px/1.2 var(--font-body); white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; box-shadow: var(--shadow-default); transition: opacity .12s var(--ease-standard), transform .12s var(--ease-standard), visibility .12s; }
.pac-tool-tip::before { content: ""; position: absolute; left: 50%; bottom: 100%; margin-left: -5px; border: 5px solid transparent; border-bottom-color: var(--pac-ink, #001738); }
.pac-tool:hover .pac-tool-tip, .pac-tool:focus-visible .pac-tool-tip { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: .25s; }
.pac-side.is-collapsed .pac-tool-tip { left: calc(100% + 10px); top: 50%; transform: translate(-2px, -50%); }
.pac-side.is-collapsed .pac-tool-tip::before { left: auto; right: 100%; bottom: auto; top: 50%; margin: -5px 0 0; border-bottom-color: transparent; border-right-color: var(--pac-ink, #001738); }
.pac-side.is-collapsed .pac-tool:hover .pac-tool-tip, .pac-side.is-collapsed .pac-tool:focus-visible .pac-tool-tip { transform: translate(0, -50%); }
.pac-side.is-open-panel .pac-tool-tip, .pac-tool.is-on .pac-tool-tip { display: none; }
@media (prefers-reduced-motion: reduce) { .pac-tool-tip { transition: none; } }