/* PharmaSync v95.20k — Employee desktop app polish.
   Presentation-only layer. Fine-pointer desktop only; mobile/tablet and app logic are untouched. */

@media (min-width:821px) and (hover:hover) and (pointer:fine) {
  html[data-ps-role="staff"] {
    --ps-staff-app-max-v95-20k: 1320px;
    --ps-staff-card-radius-v95-20k: 18px;
    --ps-staff-soft-shadow-v95-20k: 0 7px 22px rgba(15, 35, 64, .075);
    --ps-staff-hover-shadow-v95-20k: 0 11px 30px rgba(15, 35, 64, .11);
    --ps-staff-focus-v95-20k: rgba(37, 99, 235, .22);
  }

  /* Match the Owner desktop app model: spacious, but not stretched across large monitors. */
  html[data-ps-role="staff"] [data-ps-owner-employee-shell-v95-1] {
    width: min(calc(100vw - 32px), var(--ps-staff-app-max-v95-20k)) !important;
    max-width: var(--ps-staff-app-max-v95-20k) !important;
    min-width: 0 !important;
    box-shadow: 0 0 34px rgba(15, 35, 64, .11) !important;
  }

  /* Same navigation rhythm as the polished Owner shell; active colors/behavior stay native. */
  html[data-ps-role="staff"] #ps-desktop-sidebar-tabs-scroll-v94-426 > [role="button"] {
    margin: 2px 10px !important;
    border-radius: 12px !important;
    transition: background-color .16s ease, transform .16s ease, box-shadow .16s ease !important;
  }
  html[data-ps-role="staff"] #ps-desktop-sidebar-tabs-scroll-v94-426 > [role="button"]:hover {
    transform: translateX(0) translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 35, 64, .055);
  }

  /* Welcome / identity surface. */
  html[data-ps-role="staff"] :is(
    [data-testid="ps-welcome-card-v94-269"],
    [data-ps-dashboard-welcome="1"]
  ) {
    border-radius: var(--ps-staff-card-radius-v95-20k) !important;
    box-shadow: var(--ps-staff-soft-shadow-v95-20k) !important;
  }

  /* Employee dashboard metrics: keep their semantic colors, normalize rhythm/elevation. */
  html[data-ps-role="staff"] [data-ps-employee-dashboard-stats="1"] {
    gap: 12px !important;
  }
  html[data-ps-role="staff"] [data-ps-employee-stat-control="1"],
  html[data-ps-role="staff"] [data-ps-employee-stat-card="1"] {
    min-width: 0 !important;
  }
  html[data-ps-role="staff"] [data-ps-employee-stat-card="1"] {
    border-radius: 16px !important;
    box-shadow: 0 5px 17px rgba(15, 35, 64, .06) !important;
    transition: transform .16s ease, box-shadow .16s ease !important;
  }
  html[data-ps-role="staff"] [data-ps-employee-stat-control="1"]:hover [data-ps-employee-stat-card="1"] {
    transform: translateY(-1px) !important;
    box-shadow: 0 8px 22px rgba(15, 35, 64, .09) !important;
  }

  /* Employee-only dashboard helper surfaces belong to the same card family. */
  html[data-ps-role="staff"] [data-ps-team-note-card] {
    border-radius: var(--ps-staff-card-radius-v95-20k) !important;
    box-shadow: var(--ps-staff-soft-shadow-v95-20k) !important;
  }

  html[data-ps-role="staff"] #ps-monthly-payment-dashboard-tab-v94-53 {
    border-radius: var(--ps-staff-card-radius-v95-20k) !important;
    box-shadow: 0 6px 18px rgba(37, 99, 235, .09) !important;
  }
  html[data-ps-role="staff"] #ps-monthly-payment-dashboard-tab-v94-53:hover {
    box-shadow: 0 9px 24px rgba(37, 99, 235, .13) !important;
  }
  html[data-ps-role="staff"] #ps-monthly-payment-dashboard-tab-v94-53.status-warning {
    box-shadow: 0 6px 18px rgba(180, 83, 9, .09) !important;
  }
  html[data-ps-role="staff"] #ps-monthly-payment-dashboard-tab-v94-53.status-warning:hover {
    box-shadow: 0 9px 24px rgba(180, 83, 9, .13) !important;
  }

  /* Keep dense native work areas inside the app-width system. */
  html[data-ps-role="staff"] #ps-ms-root {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Consistent keyboard focus treatment across Employee desktop. */
  html[data-ps-role="staff"] #root :is(button,[role="button"],input,select,textarea):focus-visible {
    outline: 3px solid var(--ps-staff-focus-v95-20k) !important;
    outline-offset: 2px !important;
  }

  /* Subtle desktop scrollbars without changing scrolling behavior. */
  html[data-ps-role="staff"] #root * {
    scrollbar-width: thin;
    scrollbar-color: rgba(100,116,139,.45) transparent;
  }
  html[data-ps-role="staff"] #root *::-webkit-scrollbar { width: 8px; height: 8px; }
  html[data-ps-role="staff"] #root *::-webkit-scrollbar-track { background: transparent; }
  html[data-ps-role="staff"] #root *::-webkit-scrollbar-thumb {
    background: rgba(100,116,139,.34);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
  }
  html[data-ps-role="staff"] #root *::-webkit-scrollbar-thumb:hover {
    background: rgba(71,85,105,.48);
    background-clip: padding-box;
  }
}

/* Dark mode keeps the same geometry with restrained elevation. */
@media (min-width:821px) and (hover:hover) and (pointer:fine) {
  html[data-ps-role="staff"][data-ps-owner-theme="dark"] [data-ps-owner-employee-shell-v95-1],
  html[data-ps-role="staff"][data-ps-ui-theme="dark"] [data-ps-owner-employee-shell-v95-1],
  html[data-ps-role="staff"].dark [data-ps-owner-employee-shell-v95-1] {
    box-shadow: 0 0 34px rgba(0,0,0,.24) !important;
  }

  html[data-ps-role="staff"][data-ps-owner-theme="dark"] :is(
    [data-testid="ps-welcome-card-v94-269"],
    [data-ps-dashboard-welcome="1"],
    [data-ps-employee-stat-card="1"],
    [data-ps-team-note-card],
    #ps-monthly-payment-dashboard-tab-v94-53
  ),
  html[data-ps-role="staff"][data-ps-ui-theme="dark"] :is(
    [data-testid="ps-welcome-card-v94-269"],
    [data-ps-dashboard-welcome="1"],
    [data-ps-employee-stat-card="1"],
    [data-ps-team-note-card],
    #ps-monthly-payment-dashboard-tab-v94-53
  ),
  html[data-ps-role="staff"].dark :is(
    [data-testid="ps-welcome-card-v94-269"],
    [data-ps-dashboard-welcome="1"],
    [data-ps-employee-stat-card="1"],
    [data-ps-team-note-card],
    #ps-monthly-payment-dashboard-tab-v94-53
  ) {
    box-shadow: 0 5px 18px rgba(0,0,0,.12) !important;
  }
}

/* 821–1199px desktop keeps existing full-width behavior; only larger PCs get the 1320px cap. */
@media (min-width:821px) and (max-width:1199px) and (hover:hover) and (pointer:fine) {
  html[data-ps-role="staff"] [data-ps-owner-employee-shell-v95-1] {
    width: 100vw !important;
    max-width: 100vw !important;
    box-shadow: none !important;
  }
}
