/* =============================================================================
   sheen.css — shared "static gloss + restrained CTA shine" finish.
   Loaded by both the patient app and the admin portal.

   Design goals: a premium, polished feel without hurting a clinical/trustworthy
   tone or performance. Implementation is purely ADDITIVE — it uses pseudo-
   element overlays, so it never overrides element backgrounds or shadows. The
   animated shine is limited to primary (colored) buttons and is disabled under
   prefers-reduced-motion.
   ============================================================================= */

/* --- Static gloss: a subtle "lit-from-above" top edge on every button --- */
button, .btn, a.btn {
  position: relative;
}
button::after, .btn::after, a.btn::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  /* Strong only in the top few px, then gone — reads as a glossy edge, not a
     wash over the label. */
  background: linear-gradient(to bottom,
    rgba(255, 255, 255, 0.22),
    rgba(255, 255, 255, 0.05) 12px,
    rgba(255, 255, 255, 0) 16px);
  pointer-events: none;
  z-index: 0;
}

/* --- Restrained shine: a slow, faint light sweep on PRIMARY buttons only.
   Primary = the dark/blue/green/red CTAs (matched by their inline color). --- */
button[style*="#0a0a0a"], button[style*="#18181b"], button[style*="#1d6fa5"],
button[style*="#16a34a"], button[style*="#a8302d"], button[style*="#154f76"],
button[style*="var(--ink)"], button[style*="var(--primary)"] {
  overflow: hidden;
  position: relative;
}
button[style*="#0a0a0a"]::before, button[style*="#18181b"]::before,
button[style*="#1d6fa5"]::before, button[style*="#16a34a"]::before,
button[style*="#a8302d"]::before, button[style*="#154f76"]::before,
button[style*="var(--ink)"]::before, button[style*="var(--primary)"]::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 38%;
  left: -60%;
  background: linear-gradient(105deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.28) 50%,
    rgba(255, 255, 255, 0) 100%);
  transform: skewX(-18deg);
  pointer-events: none;
  z-index: 0;
  animation: uplomd-sheen-sweep 7s ease-in-out infinite;
}

@keyframes uplomd-sheen-sweep {
  0%   { left: -60%; }
  16%  { left: 130%; }
  100% { left: 130%; }   /* long pause between sweeps so it stays subtle */
}

/* Accessibility / battery: no motion for users who ask for less. The static
   top gloss stays; only the animated sweep is removed. */
@media (prefers-reduced-motion: reduce) {
  button[style*="#0a0a0a"]::before, button[style*="#18181b"]::before,
  button[style*="#1d6fa5"]::before, button[style*="#16a34a"]::before,
  button[style*="#a8302d"]::before, button[style*="#154f76"]::before,
  button[style*="var(--ink)"]::before, button[style*="var(--primary)"]::before {
    display: none;
  }
}

/* --- Dark sidebar rail: subtle vertical sheen (admin only; client has no rail).
   Pseudo overlays at the edges so icons aren't tinted. --- */
nav.sidebar { position: relative; }
nav.sidebar::before {              /* soft highlight over the top */
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 90px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0));
  pointer-events: none;
}
nav.sidebar::after {               /* glossy right edge */
  content: "";
  position: absolute; top: 0; bottom: 0; right: 0; width: 1px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.03));
  pointer-events: none;
}

/* --- Inbox panel header strips: faint top gloss. Reading areas (the lists
   and the right pane body) stay flat. These elements carry no inline
   background, so the gradient layers cleanly over the white panels. --- */
#inbox-folders, #inbox-chips {
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.85), rgba(15, 23, 42, 0.018));
}
/* Right reading pane — sheen only on its review header strip (the card's first
   row), not the document/data below it. */
#inbox-pane > div > div:first-child {
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.9), rgba(15, 23, 42, 0.02));
}

/* --- Facility list rows (patient app): a crisper divider + a faint top sheen
   so adjacent rows read as distinct, plus tap/hover feedback. --- */
.cf-fac-row {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9),
              inset 0 -1px 0 rgba(15, 23, 42, 0.06);
  transition: background 0.12s;
}
.cf-fac-row:hover, .cf-fac-row:active {
  background: #f6f8fb;
}
