/* ============================================================================
   polish.css — cross-surface premium polish (public site + portal + admin)
   ----------------------------------------------------------------------------
   ADDITIVE ONLY. Loaded LAST on all three surfaces. It does NOT restyle your
   established look (colours, layout, component shapes) — it refines *feel*:
   focus states, transitions, hover feedback, scrollbar, table readability,
   accessibility. Brand-matched to your own tokens (purple #7C3AED, dark glass).

   TO REVERT: delete this file and remove the one <link> line from each layout.
   Nothing else depends on it.
   ============================================================================ */

:root{
  --pl-accent:#7C3AED;
  --pl-accent-light:#9F5FF1;
  --pl-ring:rgba(124,58,237,.55);
  --pl-glass:rgba(255,255,255,.08);
}

/* 1. Sharper text rendering (premium sites do this). Safe, global. */
html{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility; }

/* 2. Smooth in-page scrolling. */
html{ scroll-behavior:smooth; }

/* 3. Brand text selection. */
::selection{ background:rgba(124,58,237,.35); color:#fff; }

/* 4. Custom scrollbar to match the dark glass theme (was default OS grey). */
*{ scrollbar-width:thin; scrollbar-color:rgba(124,58,237,.5) transparent; }
*::-webkit-scrollbar{ width:10px; height:10px; }
*::-webkit-scrollbar-track{ background:transparent; }
*::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(124,58,237,.55),rgba(109,40,217,.55));
  border-radius:20px; border:2px solid transparent; background-clip:content-box;
}
*::-webkit-scrollbar-thumb:hover{ background:linear-gradient(180deg,#7C3AED,#6D28D9); background-clip:content-box; }

/* 5. Consistent keyboard-focus ring (accessibility + polish). :focus-visible only,
   so mouse clicks are unaffected. */
a:focus-visible, button:focus-visible, [role="button"]:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible,
summary:focus-visible, .btn:focus-visible{
  outline:2px solid var(--pl-ring) !important;
  outline-offset:2px !important;
  border-radius:8px;
}

/* 6. Gentle, universal interaction transitions (feel). Additive; merges with any
   existing transitions. Kept to colour/shadow/transform so layout never shifts. */
a, .btn, button, .kpi, .panel, .card, .pill, .badge, summary,
input, select, textarea, .dash-nav a, .nav-link{
  transition:background-color .18s ease, border-color .18s ease,
             box-shadow .18s ease, color .18s ease, transform .18s ease, opacity .18s ease;
}

/* 7. Button press feedback (subtle, no layout change). */
.btn:active, button:active{ transform:translateY(1px); }
.btn:disabled, button:disabled{ opacity:.55; cursor:not-allowed; }

/* 8. Input focus accent — form fields glow in brand purple when focused. */
input:focus, select:focus, textarea:focus{
  border-color:var(--pl-accent) !important;
  box-shadow:0 0 0 3px rgba(124,58,237,.18) !important;
}

/* 9. Panel / KPI hover lift — gentle border brighten + shadow, no transform reflow. */
.panel:hover, .kpi:hover, .card:hover{
  border-color:rgba(124,58,237,.35);
  box-shadow:0 18px 48px rgba(0,0,0,.34);
}

/* 10. CRM table readability — row hover highlight makes long lead/pipeline tables
   far easier to scan. Scoped to dashboard tables only. */
.dash-body table tbody tr{ transition:background-color .12s ease; }
.dash-body table tbody tr:hover{ background:rgba(124,58,237,.06); }

/* 11. Respect reduced-motion (accessibility): kill non-essential motion. */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ transition-duration:.001ms !important; animation-duration:.001ms !important; animation-iteration-count:1 !important; }
}